為什么點擊一次就一下子少了三個,然后再點擊就是一個一個的呢
<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>
2016-04-10
因為你在判斷條件里面設置了i<content.childNodes.length,這樣設置就會出現你說的這種問題,給你分析下,IE下執行,節點個數5個,當我點一次刪除按鈕。
注意:5個節點分別對應下標是從0開始:
i=0 ? ? content.childNodes.length=5 ? ? ?0<5 ?刪除第一個節點后,繼續循環
i=1 ? ? content.childNodes.length=4 ? ? ?1<4 ? 刪除第二個節點后,繼續循環
i=2 ? ? content.childNodes.length=3 ? ? ?2<3 ? 刪除第三個節點后,繼續循環
i=3 ? ? content.childNodes.length=2 ? ? ?3<2 ?不成立,所以不繼續。
這也就是為什么你點擊第一次就刪除了三個節點原因。