為什么把return x注釋掉之后 點(diǎn)一次按鈕沒有反應(yīng)，點(diǎn)第二次就直接刪了三個(gè)節(jié)點(diǎn)，求大佬指點(diǎn)一下
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>無標(biāo)題文檔</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");
? // 在此完成該函數(shù)
? for (var i =0;i<content.childNodes.length;i++){
? ? ? var x = content.removeChild(content.childNodes[i])
? ? ? x = null
? ? ? return x
? }
??
}
</script>
<button onclick="clearText()">清除節(jié)點(diǎn)內(nèi)容</button>
</body>
</html>
2019-11-20
<script type="text/javascript">
// 清除空白節(jié)點(diǎn)
function cleanWhitespace(element) ??
{ ??
? ? for(i=0; i<element.childNodes.length; i++) ??
? ? { ??
? ? ? ? var node = element.childNodes[i]; ??
? ? ? ? if(node.nodeType == 3 && !/\S/.test(node.nodeValue)) ??
? ? ? ? { ??
? ? ? ? ? ? node.parentNode.removeChild(node); ??
? ? ? ? } ??
? ? } ??
} ??
cleanWhitespace(document.getElementById("content"));
function clearText() {
? var content=document.getElementById("content");
? // 在此完成該函數(shù)
? var xchild=content.childNodes;
? for(i=0;i<xchild.length;i++){
? ? ?var xclose=content.removeChild(xchild[i]);
? ? ? xclose=null;
? ? ? return xclose;
? }
}
</script>
<button onclick="clearText()">清除節(jié)點(diǎn)內(nèi)容</button>
2019-10-25
你這是經(jīng)典的錯(cuò)誤寫法。
第一，每刪除一個(gè)節(jié)點(diǎn)，content.childNodes.length的值會(huì)變化（減少），導(dǎo)致循環(huán)提前終止。
點(diǎn)擊一次按鈕，就只會(huì)刪除一半的節(jié)點(diǎn)，因?yàn)閕在增加的同時(shí)，content.childNodes.length卻在減少。
第二，第一次點(diǎn)按鈕不是沒反應(yīng)，而是因?yàn)榇嬖诳瞻坠?jié)點(diǎn)，第一次執(zhí)行刪除了所有的空白節(jié)點(diǎn)。第二次點(diǎn)按鈕，刪除了一半的非空節(jié)點(diǎn)。
修改：
var len =content.childNodes.length;
? for (var i =0;i<len;i++){
????? content.removeChild(content.childNodes[0])
?}
保證循環(huán)執(zhí)行11次（6個(gè)空白節(jié)點(diǎn)，5個(gè)非空節(jié)點(diǎn)），每次刪除第一個(gè)節(jié)點(diǎn)后，原來的第二個(gè)節(jié)點(diǎn)就變成了第一個(gè)節(jié)點(diǎn)。