为什么没法向下删除呢？一个都删除不了。求解？
<!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,i++){
var childNode=content.childNodes[0];
content.removeChild(childNode);
}
}
</script>
<button onclick="clearText()">清除节点内容</button>
</body>
</html>为什么没法向下删除呢？一个都删除不了。求解。。。
慕标8997690浏览 1697回答 4
4回答
-
super_mb
我刚刚拿你的代码跑了一下，改过for循环的问题还是有问题，首先我把我改好的代码贴出来：function clearText() { var content = document.getElementById("content"); var len = content.childNodes.length; for(var i = 0; i < len; i++){ var childNode = content.childNodes[0]; content.removeChild(childNode); } }首先你要知道使用childNodes获取的子元素包含文本节点，也就是说你获取的子节点数会多于5个（h1），你可以在控制台输出看看，应该有11个子元素，想让这个元素个数符合预期，可以有两种方法：1.在编写HTML代码时，让代码“紧密”接触：<div id="content"><h1>html</h1><h1>php</h1><h1>javascript</h1><h1>jquery</h1><h1>java</h1></div>这样，输出content.childNodes.length的值就是5.2.如果节点是元素节点，则其nodeType属性的值为1：//可以编写一个for循环来遍历所有子节点，判断是否为元素节点，是则将该子节点存在数组中 var arr = []; for(var k = 0; k < content.childNodes.length; k++) { if(content.childNodes[k].nodeType == 1) { arr.push(content.childNodes[k]); } } console.log(arr.length); //5然后再来说说你原本代码的问题，当你在for循环中每删除一个子节点，content.childNodes.length的值会减一，那么当你删除了6个子节点时，此时content.childNodes.length的值减为5，而此时你的 i 的值为5，下一轮循环开始时，你的 i 会加1变为6，此时content.childNodes.length已经小于6了，所以不再循环，于是点击一次没有删除完所有子节点。所以我使用一个中间变量len存储最开始时content.childNodes.length的值，这样无论后来content.childNodes.length怎么变化，都会循环11次，把所有子节点删除完。 -
qyy2499760117_叶子
可以改成这样for(var i=0;i<content.childNodes.length;i++)，把逗号改成分号。 -
上头
function removeC(){ var con = document.getElementById("content"); var arr = []; // 遍历子元素 for(var i = 0; i < con.childNodes.length; i ++){ // 判断子元素是否为空元素 if(con.childNodes[i].nodeType == 1){ // 不为空的放进新建数组里 arr.push(con.childNodes[i]); } } console.log(arr); con.removeChild(arr[arr.length - 1]); // 每次清除最后一个 //con.removeChild(arr[0]); 每次清除第一个 }希望能帮到你兄弟。 -
super_mb
for(var i=0,i<content.childNodes.length,i++)这个for循环中，三个逗号应该是分号吧。。改过来试试，应该就可以了。
随时随地看视频慕课网APP
相关分类
JavaScript