求助js问题。。
- HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head><script type="text/javascript">window.onload=function(){ var oC=document.getElementById("content"); var oBtn=document.getElementById("btn"); oBtn.onclick=function() { for(var i=0;i<oC.childNodes.length;i++) { oC.removeChild(oC.childNodes[0]); } }}</script></head> <body><div id="content"><h1>1</h1><h1>2</h1><h1>3</h1><h1>4</h1><h1>5</h1><h1>6</h1></div><button id="btn">清除节点内容</button></body></html>
不能点击就把节点清除完。而只是清除一半就要点击一次。如果改成这样又没问题:
- HTML code
var j=oC.childNodes.length; for(var i=0;i<j;i++) { oC.removeChild(oC.childNodes[0]); }
请教大神为什么这样。
[解决办法]
oC.childNodes.length会随着节点的删除缩小,但是你的i是一直在增大的,结果就是比对的时候:
0<6
1<5
2<4
3<3跳出
应该执行6次,,结果只执行了3次就退出了,所以只删掉了一半。
var j=oC.childNodes.length;
把length赋值给了j,for循环调用的时候j的值没有变化,始终是6,所以能成功的删掉全部
[解决办法]