javascript删除表格 js删除表格指定行

温馨提示：这篇文章已超过230天没有更新，请注意相关的内容是否还可用！

JavaScript可以通过操作DOM来删除表格中的指定行。我们需要获取到要删除的行的引用，然后使用removeChild()方法将其从表格中移除。

要删除表格中的指定行，我们可以通过以下步骤来实现：

1. 我们需要获取到要删除的表格的引用。可以使用getElementById()方法通过表格的id属性来获取到表格的引用。例如，如果表格的id为"myTable"，可以使用以下代码获取到表格的引用：


var table = document.getElementById("myTable");

2. 接下来，我们需要获取到要删除的行的引用。可以使用rows属性来获取到表格中的所有行，然后通过索引来获取到要删除的行的引用。例如，如果要删除第二行，可以使用以下代码获取到要删除的行的引用：


var row = table.rows[1];

注意，索引从0开始，所以第二行的索引为1。

3. 我们可以使用removeChild()方法将要删除的行从表格中移除。可以通过使用parentNode属性来获取到要删除行的父节点，然后调用removeChild()方法将其移除。例如，可以使用以下代码将要删除的行从表格中移除：


row.parentNode.removeChild(row);

完整的示例代码如下：


<!DOCTYPE html>
<html>
<body>
<table id="myTable">
  <tr>
    <td>Row 1, Cell 1</td>
    <td>Row 1, Cell 2</td>
  </tr>
  <tr>
    <td>Row 2, Cell 1</td>
    <td>Row 2, Cell 2</td>
  </tr>
  <tr>
    <td>Row 3, Cell 1</td>
    <td>Row 3, Cell 2</td>
  </tr>
</table>
<button onclick="deleteRow()">删除第二行</button>
<script>
function deleteRow() {
  var table = document.getElementById("myTable");
  var row = table.rows[1];
  row.parentNode.removeChild(row);
}
</script>
</body>
</html>

在上面的示例代码中，我们创建了一个包含三行的表格，并添加了一个按钮。当点击按钮时，会调用deleteRow()函数，该函数会删除表格中的第二行。

除了使用索引来删除指定行，我们还可以使用其他方法来删除表格中的行。例如，可以使用getElementsByTagName()方法来获取到指定标签名的元素，然后通过循环遍历来删除满足条件的行。这样可以更加灵活地删除表格中的行。

JavaScript可以通过操作DOM来删除表格中的指定行。我们可以通过获取表格和行的引用，然后使用removeChild()方法将行从表格中移除。这样可以实现动态删除表格中的行，使网页的交互性更强。

javascript删除表格 js删除表格指定行

相关阅读