关于 removeChild()删除节点
在做慕课的js教程时，在removeChild()删除节点这一块遇到了一个问题。题目为：定义clearText()函数，完成节点内容的删除。代码如下：
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 </head> 7 8 <body> 9 <div id="content"> 10 <h1>html</h1> 11 <h1>php</h1> 12 <h1>javascript</h1> 13 <h1>jquery</h1> 14 <h1>java</h1> 15 </div> 16 17 <script type="text/javascript"> 18 function clearText() { 19 var content=document.getElementById("content"); 20 // 在此完成该函数 21 for(var i=content.childNodes.length-1;i>=0;i--){ 22 content.removeChild(content.childNodes[i]); 23 } 24 /* for (var i = 0; i< content.childNodes.length;i++){ 25 content.removeChild(content.childNodes[i]); 26 }*/ 27 } 28 </script> 29 <button onclick="clearText()">清除节点内容</button> 30 31 </body> 32 </html>
对于循环遍历每个子节点这块，如果使用21-23行代码执行，是没有问题的。但是如果使用24-26行代码执行，就会出现问题，导致不能删除或只能删除部分。问题在于，从小往大删的话，要删除的子节点的序号随着子节点长度的减小而增大，所以会出现问题；而从大往小删除的话，要删除的子节点的序号是随着子节点长度的减小而减小的，所以不会出现问题。
所以以为遇到此类问题，记得从大往小删。
