编程(Programming)是编定程序的中文简称,就是让计算机代码解决某个问题,对某个计算体系规定一定的运算方式,使计算体系按照该计算方式运行,并最终得到相应结果的过程。为了使计算机能够理解(understand)人的意图,人类就必须将需解决的问题的思路、方法和手段通过计算机能够理解的形式告诉计算机,使得计算机能够根据人的指令一步一步去工作,完成某种特定的任务。这种人和计算体系之间交流的过程就是编程。 【实例名称】 JS代码实现手动调整的列表框 【实例描述】 列表框用来显示一组相似的信息,本例学习如何动态实现列表框内容的添加、删除、上移和下移。 【实例代码】 <script language="javascript">
function move(listItem,listObj) {
//列表项添加的方法
var i = 0;
if(listItem.value != "") {
//如果列表项不为空
var newOp = new Option();
//创建一个列表项
newOp.value = listItem.value;
//设置列表项的值
newOp.text = listItem.value;
//设置列表项的文本
listObj.options[listObj.options.length] = newOp;
//添加新项到列表框中
listItem.value = "";
}
} function remove(listObj) {
//列表框的删除方法
for(var i=0; i<listObj.options.length; i++) {
if(listObj.options[i].selected &&
listObj.options[i] != "") {
listObj.options[i].value = "";
//清除选定项的值
listObj.options[i].text = "";
//清除选定项的文本
}
}
delAfter(listObj);
//删除后的排序处理
}
function delAfter(alistObj) {
for(var i = 0; i < alistObj.options.length; i++) {
if(alistObj.options[i].value == "") {
//值为空的会被清除
for(var j = i; j < alistObj.options.length - 1; j++) {
alistObj.options[j].value = alistObj.options[j + 1].value;
//重新排列顺序
alistObj.options[j].text = alistObj.options[j + 1].text;
}
var ln = i;
break;
}
}
if(ln < alistObj.options.length) {
alistObj.options.length -= 1;
delAfter(alistObj);
}
}
function Moveup(listObj) {
//将列表项往上移动
for(var i = 0; i < listObj.options.length; i++) {
//遍历列表项
if (listObj.options[i].selected && listObj.options[i] != ""
&& listObj.options[i] != listObj.options[0]) {
var tmpval1 = listObj.options[i].value;
//获取当前项的值
var tmpval12 = listObj.options[i].text;
//获取当前项的文本
listObj.options[i].value = listObj.options[i - 1].value;
//获取上一项的值
listObj.options[i].text = listObj.options[i - 1].text
//获取上一项的文本
listObj.options[i-1].value = tmpval1;
//实现上下值的互换
listObj.options[i-1].text = tmpval12;
//实现上下文本的互换
}
}
}
function Movedown(listObj) {
//将列表项往下移动
for(var i = 0; i < listObj.options.length; i++) {
if (listObj.options[i].selected && listObj.options[i] !=
"" && listObj.options[i+1] != listObj.options[listObj.options.length])
{
var tmpval1 = listObj.options[i].value;
//获取当前项的值
var tmpval12 = listObj.options[i].text;
//获取当前项的文本
listObj.options[i].value = listObj.options[i+1].value;
//获取下一项的值
listObj.options[i].text = listObj.options[i+1].text
//获取下一项的文本
listObj.options[i+1].value = tmpval1;
//实现上下值的互换
listObj.options[i+1].text = tmpval12;
//实现上下文本的互换
}
}
}
</script>
【运行效果】
【难点剖析】 本例的重点是对列表框的遍历。当添加新项到列表框时,通过创建新。ption元素的方式添加项。当删除选项时,先设置选项的值为空,然后以遍历的方式将值为空的项删除。上移和下移的方法都是通过遍历列表框,然后进行上下选项值的互换。 【源码下载】 本实例JS代码下载
使用编程语言写的程序,由于每条指令都对应计算机一个特定的基本动作,所以程序占用内存少、执行效率高。 |