javascript 实现select元素节点的子节点清空的例子，求分析下代码
代码连接http://codepad.org/Zmhq5Lg7看这个也行，就是代码格式很渣：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0...
代码连接
http://codepad.org/Zmhq5Lg7
看这个也行，就是代码格式很渣：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<script type="text/javascript">
<!--
//删除slelte节点下，除第一个子节点外的所以节点
window.onload = function(){
var provinceNode = document.getElementById("province");
var optionNodes = provinceNode.getElementsByTagName("option");
document.getElementById("del_1").onclick = function(){
for(var i=1;i<optionNodes.length;i++){
provinceNode.removeChild(optionNodes[1]);
}
}
document.getElementById("del_2").onclick = function(){
var len = optionNodes.length;
for(var i=1;i<len;i++){
provinceNode.removeChild(optionNodes[1]);
}
}
}
//-->
</script>
</head>
<body>
<select id="province">
<option value="">请选择...</option>
<option value="河北省">河北省</option>
<option value="辽宁省">辽宁省</option>
<option value="山东省">山东省</option>
</select>
<button id="del_1">清空1</button>
<button id="del_2">清空2</button>
</body>
</html>
为什么 按钮“清空1” 不能完全清空（除第一个外）.
而按钮“清空2”的却可以，而它们的代码就一处不同（应该能看出来吧）。
求分析一下代码，是什么原因造成结果不一致。 展开
http://codepad.org/Zmhq5Lg7
看这个也行，就是代码格式很渣：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<script type="text/javascript">
<!--
//删除slelte节点下，除第一个子节点外的所以节点
window.onload = function(){
var provinceNode = document.getElementById("province");
var optionNodes = provinceNode.getElementsByTagName("option");
document.getElementById("del_1").onclick = function(){
for(var i=1;i<optionNodes.length;i++){
provinceNode.removeChild(optionNodes[1]);
}
}
document.getElementById("del_2").onclick = function(){
var len = optionNodes.length;
for(var i=1;i<len;i++){
provinceNode.removeChild(optionNodes[1]);
}
}
}
//-->
</script>
</head>
<body>
<select id="province">
<option value="">请选择...</option>
<option value="河北省">河北省</option>
<option value="辽宁省">辽宁省</option>
<option value="山东省">山东省</option>
</select>
<button id="del_1">清空1</button>
<button id="del_2">清空2</button>
</body>
</html>
为什么 按钮“清空1” 不能完全清空（除第一个外）.
而按钮“清空2”的却可以，而它们的代码就一处不同（应该能看出来吧）。
求分析一下代码，是什么原因造成结果不一致。 展开
1个回答
展开全部
看以上代码的初步判断觉得：因为在删除的过程中optionNodes.length是在不断变化中，也就是说那个for循环的条件在逐步变小，所以就不能完全删除；而第二个你提前将它声明成变量，在执行循环的过程中，这个值是不发生变化的，所以可以完全删除清空！
更多追问追答
追问
为什么我放在for里面取得optionNodes的长度会不断变化
追答
因为每次循环到判断条件时，它都会计算optionNodes的长度，而这时你的optionNodes在循环一次后它的数量是发生变化的，这个length不是它的固有属性，会一直不变。所以说一般在写这类循环时（无论那个长度是否发生变化），最好用变量单独定义这些，这也是提高效率的表现。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
