Node.removeChild
Node.removeChild() 方法从 DOM 中删除一个子节点。返回删除的节点。
语法
let oldChild = node.removeChild(child); //OR element.removeChild(child);
child是要移除的那个子节点。node是child的父节点。- oldChild 保存对删除的子节点的引用。
oldChild===child.
被移除的这个子节点仍然存在于内存中，只是没有添加到当前文档的 DOM 树中，因此，你还可以把这个节点重新添加回文档中，当然，实现要用另外一个变量比如上例中的 oldChild来保存这个节点的引用。如果使用上述语法中的第二种方法，即没有使用 oldChild 来保存对这个节点的引用，则认为被移除的节点已经是无用的，在短时间内将会被内存管理回收。
如果上例中的child 节点不是node节点的子节点，则该方法会抛出异常。
示例
<!--Sample HTML code-->
<div id="top" align="center"> </div>
<script type="text/javascript">
var top = document.getElementById("top");
var nested = document.getElementById("nested");
var garbage = top.removeChild(nested);
//Test Case 2: the method throws the exception (2)
</script>
<!--Sample HTML code-->
<div id="top" align="center">
<div id="nested"></div>
</div>
<script type="text/javascript">
var top = document.getElementById("top");
var nested = document.getElementById("nested");
var garbage = top.removeChild(nested);
// This first call remove correctly the node
garbage = top.removeChild(nested);
// Test Case 1: the method in the second call here, throws the exception (1)
</script>
<!--示例 HTML 代码--> <div id="top" align="center"> <div id="nested"></div> </div>
// 先定位父节点，然后删除其子节点
var d = document.getElementById("top");
var d_nested = document.getElementById("nested");
var throwawayNode = d.removeChild(d_nested);
// 无须定位父节点，通过 parentNode 属性直接删除自身
var node = document.getElementById("nested");
if (node.parentNode) {
node.parentNode.removeChild(node);
}
// 移除一个元素节点的所有子节点
var element = document.getElementById("top");
while (element.firstChild) {
element.removeChild(element.firstChild);
}