为了账号安全,请及时绑定邮箱和手机立即绑定

为什么一键删除不了呢?

<!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");

  // 在此完成该函数

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

    if(content.childNodes.length>0){

  var ch = content.childNodes[i];

  content.removeChild(ch); 

    }

 

  }

  

}

</script>


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




</body>

</html>


正在回答

3 回答

for(var i = 0; i < content.childNodes.length-1; i++){
    if(content.childNodes.length>0){
  var ch = content.childNodes[i];
  content.removeChild(ch); 
    }
 
  }

这是你的代码,这个问题其实不难,可能你被绕进去了,一下子没出的来。

我们这里举一个简单的例子来说明一下,假设没有空白节点且 childNodes 数组中只有三个元素,

childNodes = ["html","php","java"]; // 简单举例

i = 0 时,childNodes[0] 为 html,被删除。

但这时,childNodes 数组发生了变化,变为 ["php","java"],只剩两个元素,因为 html 被删除了。

此时,显然,childNodes 数组的 length 也发生变化,从 3 变为了 2。

i++,i = 1,第二次循环要删除的是 childNodes[1],也就是 java,而不是 php,php 被留在了数组中,没有删除。

怎么改?方法有不少,列举几种:

第一种

for(var i=content.childNodes.length-1;i>=0;i--){
     var childNode = content.childNodes[i];
     content.removeChild(childNode);
  }

给 i 赋初值为数组长度减一,也就是定位在 childNodes 数组的最后一个元素,然后每次循环 i--,从后往前删,这样虽然数组的长度一直在变化,但前面没删的元素不受影响,下标保持不变。

第二种

while (content.childNodes.length > 0) {
    var childNode = content.childNodes[0];
    content.removeChild(childNode);
}

这个是判断当前 childNodes 数组中是否还有元素,如果有,就将第一个删除,不用去管删的是什么,也不用管下标,直到删光为止。

第三种

while (content.firstChild) {
      var node = content.firstChild;
      content.removeChild(node);
  }

这和第二种方法类似,不过将 childNodes[0] 换成了 firstChild,意思一样的。就是判断当前 content 的第一个子节点,如果存在,就删除第一个子节点,继续判断,当 firstChild 返回 null,说明全部删除。

0 回复 有任何疑惑可以回复我~
#1

安歌Moose 提问者

非常感谢!
2016-10-15 回复 有任何疑惑可以回复我~

因为你删掉的同时,length的长度一直在变到后面i大于length的长度了就不会删了,for循环里面的i++删掉就行了

0 回复 有任何疑惑可以回复我~
删掉 for 循环吧
0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么一键删除不了呢?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信