求解释为啥删不掉所有节点？-慕课网

首页课程实战体系课手记专栏慕课教程

求解释为啥删不掉所有节点？

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

qq_WT_9

2018-07-13 15:55

<!DOCTYPE HTML>

<html>

<head>

<title>无标题文档</title>

</head>

<body>

<h1>javascript</h1>

<h1>jquery</h1>

</div>

function clearText() {

var content=document.getElementById("content");

// 在此完成该函数

for(var i=0;i<content.length;i++){

var x=content.removeChild(content.childNodes[i])

}

</script>

<button onclick="clearText()">清除节点内容</button>

</body>

</html>

写回答关注

7回答

风起临冬

2018-08-03 12:23:38

i的条件写错了，应该是content的所有子节点长度。另外还要注意非IE浏览器会把空白当成节点，还有，每次删除节点，整个数组会发生变化，原来索引1的值会变成索引0，而i经过循环变成了1，索引0就删不掉了，这个代码会造成隔行删的情况，需要想想如何修改。

0 3
慕先生5247145

2018-07-31 18:08:51

第一个回答的为什么要嘲讽别人啊。
而且content.childNodes[i]这个没有问题吧，遍历的是content下的子节点啊。
有问题的是i的取值，应该是i<content.childNodes.length。取对了之后是可以删除的，但是不能一次删去，可以想想为什么再去尝试，加油～

1 2

风起临冬

喜欢嘲讽新手的往往只是比新手多学了一点的新手，经过一整段坎坷学习过程的高手反而会理解刚入门的小白的。

2018-08-03 12:14:43

共 1 条回复 >
慕设计2549849

2018-07-26 15:46:56

应该是由于删除了子代节点之后，集合变了的关系，这样写可以一次删除
<!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 children=content.childNodes;
var length=children.length;
while(children!=null){
var x=content.removeChild(children[0]);
x=null;
}

/*
这个不能一次完成删除，应该是因为children被删除
之后出现改变的原因
for(var i=0;i<length;i++){
var x= content.removeChild(children[i]);
x=null;
}*/

}
</script>

<button onclick="clearText()">清除节点内容</button>

</body>
</html>

0 0
慕仰5314311

2018-07-14 20:38:51

id获得的是一个值不是一个数组你对一个数组进行遍历牛逼

1 1

风起临冬

你的前后逻辑有问题啊，他并没有对数组遍历，content.childNodes[i]是数组？他只是i的条件写错了，应该是content的所有子节点长度。另外还要注意非IE浏览器会把空白当成节点，还有，每次删除节点，整个数组会发生变化，这个代码会造成隔行删的情况，需要想想如何修改。

2018-08-03 12:21:53

共 1 条回复 >
WEB前端_知秋

2018-07-14 14:05:55

for(var i=0;i<content.childNodes.length;i++){ }; for循环里面遍历的数组没取对

0 1
想转IT的机械狗

2018-07-14 11:58:41

var x=content.removeChild(content.childNodes[i]) 是不是少了一个“；”

0 0
阳火锅

2018-07-13 16:07:17

仔细把理论看一下再写代码，真的。。这样对你有好处

0 0