It has been 1485 days since the last update, the content of the article may be outdated.

删除一个DOM节点就比插入要容易得多。
要删除一个节点，首先要获得该节点本身以及它的父节点，然后，调用父节点的removeChild把自己删掉：

javascript
/ 拿到待删除节点:
var self = document.getElementById('to-be-removed');
// 拿到父节点:
var parent = self.parentElement;
// 删除:
var removed = parent.removeChild(self);
removed === self; // true

当你遍历一个父节点的子节点并进行删除操作时，要注意，children属性是一个只读属性，并且它在子节点变化时会实时更新

试验：

html
<!-- 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>

把与Web开发技术不相关的节点删掉：
我的方案 ：

javascript
var i,a
var list=document.getElementById("test-list");
i=0;
while(i<list.children.length){
     a=list.children[i];     
     if (a.innerHTML==='Swift'||a.innerHTML==='ANSI C'||a.innerHTML==='DirectX'){
         list.removeChild(a);
         i--;
         };
     i++;
}

思考：删除以后children 会变吗，i-- 有没有必要？

测试了一下，如果要删除的元素有相邻的情况比如:

html
<ul id="test-list">
    <li>JavaScript</li>
    <li>Swift</li>
    <li>HTML</li>
    <li>ANSI C</li>     
    <li>DirectX</li>
    <li>CSS</li>
</ul>

删除 ANSI C 以后 children 会继续减小1， DirectX 将会被跳过无法删除， i-- 可以有效避免这种情况。
所以选择 while 结构可以控制循环变量。

测试源码open in browser:

html
<!Doctype>
<html>
<head>
<meta charset="utf-8"></meta>
<title>js test</title>
<script>
function remove(tag){
var i,a
var list=document.getElementById(tag);
i=0;
while(i<list.children.length){
     a=list.children[i];     
     if (a.innerHTML==='Swift'||a.innerHTML==='ANSI C'||a.innerHTML==='DirectX'){
         list.removeChild(a);
        // i--;
         };
     i++;
}
}
</script>

</head>

<body>
 <button type='button' onclick=remove("test-list1")>remove</button>
 
<!-- HTML结构 -->
<ul id="test-list1">
    <li>JavaScript</li>
    <li>Swift</li>
    <li>HTML</li>
    <li>ANSI C</li> 	
    <li>CSS</li>
    <li>DirectX</li>
</ul>


<button type='button' onclick=remove("test-list2")>remove</button>
<!-- HTML结构 -->
<ul id="test-list2">
    <li>JavaScript</li>
    <li>Swift</li>
    <li>HTML</li>
    <li>ANSI C</li>
    <li>DirectX</li> 	
    <li>CSS</li>
</ul>
 
</body>
</html>