weibo_喇wait_0
2018-05-31 21:33
function clearText() {
var content=document.getElementById("content");
// 在此完成该函数
for(var i=1;i<content.childNodes.length;i++){
content.removeChild(content.childNodes[i]);
}
}
<div id="content">空白节点 <h1>html</h1>空白节点 <h1>php</h1>空白节点 <h1>javascript</h1>空白节点 <h1>jquery</h1>空白节点 <h1>java</h1>空白节点 </div>
如上图,这段代码中每一行后都有空白,所以在content.childNodes数组中是这样的:
[空白节点,h1,空白节点,h1,空白节点,h1,空白节点,h1,空白节点,h1,空白节点]
所以当你设置i为1时,content会将5个h1节点全部删除,在网页上显示的就是全部删除,其实还留下了6个空白节点。
如果你把上述代码改成
<div id="content"><h1>html</h1><h1>php</h1><h1>javascript</h1><h1>jquery</h1><h1>java</h1></div>
其中没有任何换行,接着你再将i设置为1后会发现并不能一次将所有的子节点全部删除
for(var i=content.childNodes.length-1;i>0;i--)。比如有0-10个子节点,如果从0开始删除节点,节点变为0-9。但是你第二次i变为了1。原来的第0个就没删了。循环下去的。所以建议从最大的节点值开始删除。
JavaScript进阶篇
468194 学习 · 21891 问题
相似问题