数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装学
法学JavaScript 中如何根据 ID 删除元素？
在 JavaScript 中根据 ID 删除元素的方法是操作 DOM（文档对象模型）的强大工具。它允许您根据 ID 从页面中删除元素。这在删除不需要的元素或动态创建内容时非常有用。语法很简单，本文将更详细地解释如何使用它。
为了使网站具有交互性，JavaScript 提供了许多功能。从网页中删除节点或元素是 JavaScript 提供的最基本功能之一。
让我们按照以下步骤了解如何在 JavaScript 中删除元素。
getElementByID 方法
remove() 方法
让我们深入了解本文，以便更好地理解如何在 JavaScript 中根据 ID 删除元素。
getElementByID 方法
顾名思义，getElementsByID JavaScript 方法用于查找元素的 ID 并将其返回给变量。返回元素的值可用于许多任务。
语法
以下是 getElemnetByID 的语法
remove() 方法
可以使用 JavaScript 的 remove() 方法删除元素或节点。不需要参数，也不返回值。
语法
以下是 remove() 的语法
element.remove()
让我们看看以下示例，以了解更多关于如何在 JavaScript 中根据 ID 删除元素的信息。
示例
在下面的示例中，我们运行一个简单的脚本删除元素
<!DOCTYPE html>
<html>
<body>
<h1 id="tutorial">welcome</h1>
<button onclick="myRemoveFunction()">Click To Remove</button>
<script>
function myRemoveFunction() {
var textRemove = document.getElementById("tutorial");
textRemove.remove();
}
</script>
</body>
</html>
脚本执行后，它将在网页上生成包含文本和按钮的输出。当用户单击按钮时，将触发事件，并删除网页上的<h1>文本。
示例
考虑以下使用输入字段和 remove() 方法的示例。
<!DOCTYPE html>
<html>
<body>
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<button onclick="myRemoveFunction()">Click To Remove</button>
<script>
function myRemoveFunction() {
var textRemove = document.getElementById("fname");
textRemove.remove();
}
</script>
</body>
</html>
运行上述脚本后，Web 浏览器将显示输入字段和单击按钮。当用户单击按钮时，将触发事件并删除网页上的输入文本区域框。
示例
让我们考虑另一个示例，我们使用 div 和 remove()
<!DOCTYPE html>
<html>
<body>
<div id="tutorial">
<input type="text"><br>
<input type="text"><br>
<input type="radio"><br>
<input type="text"><br>
<input type="radio"><br>
</div><br>
<span id='totalNumberOfTextBox'></span>
<button onclick="myRemoveFunction()">Click To Remove</button>
<script>
function myRemoveFunction() {
var textRemove = document.getElementById("tutorial");
textRemove.remove();
}
</script>
</body>
</html>
脚本执行后，它将在 Web 浏览器上生成包含输入字段、单选按钮和单击按钮的输出。当用户单击按钮时，将触发一个事件，该事件将删除 Web 浏览器上的所有内容。
6000+ 次浏览
