HTML | DOM 选择 remove() 方法(1)

📌 相关文章

📜 HTML | DOM 选择 remove() 方法(1)

📅 最后修改于: 2023-12-03 15:01:14.260000 🧑 作者: Mango

HTML | DOM 选择 remove() 方法

在HTML | DOM中，remove()方法可以从父元素中删除指定的子元素。

语法

element.remove();

参数

该方法没有任何参数。

返回值

该方法不返回任何值。

示例

下面的示例展示了如何使用remove()方法从DOM中删除元素：

<!DOCTYPE html>
<html>
<body>

<h2>使用remove()方法删除元素</h2>

<div id="myDiv">
    <p>要删除的段落</p>
</div>

<button onclick="removeElement()">删除段落</button>

<script>
function removeElement() {
    var elem = document.querySelector("#myDiv p");
    elem.remove();
}
</script>

</body>
</html>

在上面的示例中，我们首先创建包含一个段落元素的div元素，然后创建一个按钮，以便可以通过单击它来删除段落元素。

在JavaScript中，我们使用querySelector()方法获取要删除的元素，然后使用remove()方法从DOM中删除该元素。

注意事项

该方法只能应用于具有父元素的元素。因此，如果要删除的元素没有父元素，该方法将不起作用。
该方法不会删除元素本身，只会删除元素的引用。因此，如果在删除元素之前将其存储到变量中，则该变量将引用一个不存在的元素。