刪除一個節(jié)點
// 拿到待刪除節(jié)點:
var self = document.getElementById('to-be-removed');
// 拿到父節(jié)點:
var parent = self.parentElement;
// 刪除:
var removed = parent.removeChild(self);
removed === self; // true
刪除后的節(jié)點不在文檔樹中示绊,但還在內存中
children屬性是一個只讀屬性莉兰,并且它在子節(jié)點變化時會實時更新
<div id="parent">
<p>First</p>
<p>Second</p>
</div>
var parent = document.getElementById('parent');
parent.removeChild(parent.children[0]);
parent.removeChild(parent.children[1]); // <-- 瀏覽器報錯
練習 刪除Web開發(fā)技術不相關的節(jié)點
<!-- HTML結構 -->
<ul id="test-list">
<li>JavaScript</li>
<li>Swift</li>
<li>HTML</li>
<li>ANSI C</li>
<li>CSS</li>
<li>DirectX</li>
</ul>
'use strict';
var parent = document.getElementById('test-list');
for (var i=0; i<parent.children.length; i++) {
var text = parent.children[i].innerText;
if (text == 'Swift' || text == 'ANSI C' || text == 'DirectX') {
parent.removeChild(parent.children[i]);
}
};