删除节点removeChild()，下面代码不是应该一个一个删除的吗？为什么我运行的时候是全部一起删的，这儿不太明白？那一个一个要怎样删除

源自：9-14 删除节点removeChild()

删除节点removeChild()，下面代码不是应该一个一个删除的吗？为什么我运行的时候是全部一起删的，这儿不太明白？那一个一个要怎样删除

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<div id="content">
  <h1>html</h1>
  <h1>php</h1>
  <h1>javascript</h1>
  <h1>jquery</h1>
  <h1>java</h1>
</div>
<script type="text/javascript">
function clearText() {
  var content=document.getElementById("content");
  // 在此完成该函数
  var a=content.childNodes;
  for(var i=a.length-1;i>=0;i--){     
        var x=content.removeChild(a[0]);    
  }
} 
</script>
<button onclick="clearText()">清除节点内容</button>
</body>
</html>

提问者：Charless 2015-08-28 19:51

个回答

zoe0773

2015-09-01 17:57:03

function clearText() {
var content=document.getElementById("content");
//每单击一次按钮，依次从最后删除一个nodechild，删除break语句后可以一次全部清除节点。
outerloop: //带标签的代码块
for(var i=(content.childNodes.length)-1; i>=0; i--){
var lastnode = content.childNodes[i];
if(lastnode.nodeType==1){
content.removeChild(lastnode);
break outerloop;//可以更精准的指示流程控制
}
}
}

0
非常OK

2015-08-28 23:34:29

function clearText() {
var content=document.getElementById("content");
var a=content.childNodes;
    for(var i=a.length-1;i>=0;i--){
          if(a[i].nodeType=='1'){//判断元素类型为1则是h1,排除掉空格
           content.removeChild(a[i]);
           return false;//每执行一次中断循环
     }
   }
}

1