為什么點(diǎn)擊一次就一下子少了三個(gè)，然后再點(diǎn)擊就是一個(gè)一個(gè)的呢
<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()">清除節(jié)點(diǎn)內(nèi)容</button>
</body>
2016-04-10
因?yàn)槟阍谂袛鄺l件里面設(shè)置了i<content.childNodes.length，這樣設(shè)置就會(huì)出現(xiàn)你說的這種問題，給你分析下，IE下執(zhí)行，節(jié)點(diǎn)個(gè)數(shù)5個(gè)，當(dāng)我點(diǎn)一次刪除按鈕。
注意:5個(gè)節(jié)點(diǎn)分別對(duì)應(yīng)下標(biāo)是從0開始:
i=0 ? ? content.childNodes.length=5 ? ? ?0<5 ?刪除第一個(gè)節(jié)點(diǎn)后，繼續(xù)循環(huán)
i=1 ? ? content.childNodes.length=4 ? ? ?1<4 ? 刪除第二個(gè)節(jié)點(diǎn)后，繼續(xù)循環(huán)
i=2 ? ? content.childNodes.length=3 ? ? ?2<3 ? 刪除第三個(gè)節(jié)點(diǎn)后，繼續(xù)循環(huán)
i=3 ? ? content.childNodes.length=2 ? ? ?3<2 ?不成立，所以不繼續(xù)。
這也就是為什么你點(diǎn)擊第一次就刪除了三個(gè)節(jié)點(diǎn)原因。