DOM
當(dāng)遍歷一個(gè)父節(jié)點(diǎn)的子節(jié)點(diǎn)并進(jìn)行刪除操作時(shí),要注意,children
屬性是一個(gè)只讀屬性,并且它在子節(jié)點(diǎn)變化時(shí)會(huì)實(shí)時(shí)更新悴灵。
// HTML
<div id="parent">
<p>First</p>
<p>Second</p>
</div>
// js
var parent = document.getElementById('parent');
parent.removeChild(parent.children[0]);
parent.removeChild(parent.children[1]); // <-- 瀏覽器報(bào)錯(cuò)
瀏覽器報(bào)錯(cuò):parent.children[1]
不是一個(gè)有效的節(jié)點(diǎn)。原因就在于骂蓖,當(dāng)<p>First</p>
節(jié)點(diǎn)被刪除后积瞒,parent.children
的節(jié)點(diǎn)數(shù)量已經(jīng)從 2 變?yōu)榱?1,索引[1]
已經(jīng)不存在了涯竟。
因此赡鲜,刪除多個(gè)節(jié)點(diǎn)時(shí)空厌,要注意children
屬性時(shí)刻都在變化庐船。