<!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>为什么没法向下删除呢？一个都删除不了。求解。。。
4 回答
已采纳
super_mb
TA贡献101条经验 获得超107个赞
我刚刚拿你的代码跑了一下，改过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次，把所有子节点删除完。
上头
TA贡献7条经验 获得超5个赞
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
TA贡献101条经验 获得超107个赞
for(var i=0,i<content.childNodes.length,i++)这个for循环中，三个逗号应该是分号吧。。改过来试试，应该就可以了。
添加回答
举报
0/150
提交
取消