html5의 JavaScript RemoveChild는 모든 node_html5 튜토리얼 팁을 삭제합니다.

假设div里有这么些内容：

复主代码

代码如下:

< ;!DOCTYPE html>

<머리>





<본문>

• 예쁜 행 1>
  
• 예쁜 행 2>
  
• 예쁜 3행>
  
• 예쁜 4행>
  
• 예쁜 5행>
  
• 예쁜 6행>
  
• 예쁜 7행>
  
• 예쁜 8행>
  
• 예쁜 9행>
  
• 예쁜 행 10>
  
• 예쁜 행 40

JavaScript의 功能,将它们清空.

虽然可以过一句代码直接实现：

document.getElementB yId("content").innerHTML =""

但是本文里主要讨论 RemoveChild 函数。

很想当然地以为借助下면的代码就能完：

复代码码

代码如下:

function deleteData(){
var el = document.getElementById('thelist');
var liNodes = document.getElementsByTagName("li");
경고(liNodes.length);
for(var i = 0; i < liNodes.length; i ){
alert("删除" i " liNodes[i]=" liNodes[i]);
el.removeChild(liNodes[i]);
//<-- el.removeChild(liNodes[i]);
}
}

没想到，点击了按钮后，竟然只清除掉1、3、5...，而2、4、6...竟然没有消失，

问题从一开始就产生了：

删除掉第一个节点后，后면节点的顺序전체부发生了变화：원래来的第日个节点往前蹭，成为새로운 제第一个节点;원유적 제3个节点，成为第二个节点…始的第三个节点给删除掉了。

最终，并没有전체부删除，只删除掉1、3、5，留下了2、4、6。

语法没有错误，但是得不到所要的结果，这就是算法上面的错误!该如何修正呢?

“顺序删除”不行，那就“逆序删除”吧。将 for 语句修改一下：

复代码码代码如下:

function deleteData(){

var el = document.getElementById(' 목록');
var liNodes = document.getElementsByTagName("li");
경고(liNodes.length);
for(var i = liNodes.length-1; i >=0; i--){
alert("删除" i " liNodes[i]=" liNodes[i]);
el.removeChild(liNodes[i]);
//<-- el.removeChild(liNodes[i]);
}
}


试试吧,成功了！还可以使사용하면방법:

复代码代码如下:

function deleteData() {

var el = document.getElementById('thelist');
var liNodes = document.getElementsByTagName("li");
경고(liNodes.length);
for (var i=0;ivar childNode = el.childNodes[0]; //总是删除第一个，是不是更简单
el.removeChild(childNode);
}
}


完成代码如下所示：

复代码如下:

<머리>





<본문>

• 예쁜 행 1>
  
• 예쁜 행 2>
  
• 예쁜 3행>
  
• 예쁜 4행>
  
• 예쁜 5행>
  
• 예쁜 6행>
  
• 예쁜 7행>
  
• 예쁜 8행>
  
• 예쁜 9행>
  
• 예쁜 행 10>
  
• 예쁜 행 40

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.