Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

Node.removeChild

概述

从某个父节点中移除指定的子节点,并返回那个子节点.

语法

var oldChild = node.removeChild(child);
  • child 是要移除的那个子节点.
  • nodechild的父节点.
  • oldChildchild指向同一个节点,即oldChild === child.

被移除的这个子节点仍然存在于内存中,只是没有添加到当前文档的DOM树中,因此,你还可以把这个节点重新添加回文档中,当然,实现要用另外一个变量比如上例中的oldChild来保存这个节点的引用.

如果上例中的child节点不是node节点的子节点,则该方法会抛出异常.

示例

<!--示例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);
}

规范

相关链接

文档标签和贡献者

 此页面的贡献者: Hyuni, alonprince, teoli, khalid32, ziyunfei
 最后编辑者: Hyuni,