📌  相关文章
📜  HTML | DOM removeChild() 方法(1)

📅  最后修改于: 2023-12-03 14:41:48.589000             🧑  作者: Mango

HTML | DOM removeChild() 方法

简介

removeChild() 方法是 HTML DOM 中的一个方法，在 JavaScript 中用于从父节点中移除指定的子节点。该方法被用于操作 HTML 文档中的元素和节点树。

语法
element.removeChild(childNode)
参数
  • childNode: 要被移除的子节点。
返回值

被移除的子节点的引用。

示例

下面是使用 removeChild() 方法的一个简单示例：

<html>
  <body>
    <div id="myDiv">
      <p id="myPara">这是一个段落。</p>
    </div>

    <button onclick="removePara()">移除段落</button>

    <script>
      function removePara() {
        var div = document.getElementById("myDiv");
        var para = document.getElementById("myPara");
        div.removeChild(para);
      }
    </script>
  </body>
</html>

上述示例中，点击 "移除段落" 按钮后，removePara() 函数会从 myDiv 元素中移除 myPara 段落。

注意事项
  • node 参数必须是要被移除的元素的直接子节点。
  • 被移除的子节点并不会被销毁，可以将其存储在变量中以备将来使用。
  • 如果要移除的子节点不存在，removeChild() 方法会抛出一个异常。因此，在调用该方法之前，最好先检查下子节点是否存在。
总结

removeChild() 方法是 HTML DOM 中用于移除指定子节点的常用方法。它提供了一种简单的方式来操作 HTML 文档中的元素和节点树。使用该方法时需要注意参数的正确性并处理可能的异常情况。

更多关于 removeChild() 方法的详细信息，可以参考 MDN 文档。