javascript - 如何仅使用 JavaScript 从 <tbody> 中删除每第三行？

<分区>

我想删除这段代码中的每三行。我该怎么做？感谢您的任何回答

我正在尝试做这样的事情:

const table = document.getElementById('myTable');

for (let i =0; i <table.rows.length; i++) {
  if (i%3 === 0 ) {
    table.deleteRow(i)
  }
}

我有这张表:

        <tbody>
            <tr>
                <td>First row.</td>
            </tr>
            <tr>
                <td>Second row.</td>
            </tr>
          <tr>
                <td>DELETE 3</td>
            </tr>
          <tr>
                <td>4 row.</td>
            </tr>
          <tr>
                <td>5 row.</td>
            </tr>
          <tr>
                <td>DELETE 6</td>
            </tr>
          <tr>
                <td>First row.</td>
            </tr>
            <tr>
                <td>Second row.</td>
            </tr>
          <tr>
                <td>DELETE 9</td>
            </tr>
        </tbody>

我需要一个脚本，我将把它放在浏览器的控制台中，我将删除任何表中的每第三行。谢谢!

最佳答案

问题是，一旦您从表中删除一行，表的 rows.length 属性就会减 1，并且行的顺序也会发生变化。 (因此在删除之后，接下来的三分之一将是与删除之前不同的元素)

最好从最后一个元素迭代到第一个元素，例如:

var myTable = document.getElementById("myTable");
for (var a = myTable.rows.length - 1; a > 0; a--) {
  if ((a + 1) % 3 === 0) {
    myTable.deleteRow(a)
  }
}

<table id="myTable">

  <tbody>
    <tr>
      <td>First row.</td>
    </tr>
    <tr>
      <td>Second row.</td>
    </tr>
    <tr>
      <td>DELETE 3</td>
    </tr>
    <tr>
      <td>4 row.</td>
    </tr>
    <tr>
      <td>5 row.</td>
    </tr>
    <tr>
      <td>DELETE 6</td>
    </tr>
    <tr>
      <td>First row.</td>
    </tr>
    <tr>
      <td>Second row.</td>
    </tr>
    <tr>
      <td>DELETE 9</td>
    </tr>
  </tbody>
</table>

关于javascript - 如何仅使用 JavaScript 从 <tbody> 中删除每第三行？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56343169/

上一篇：带有默认值的 JavaScript JSON API 解析器？

下一篇：javascript - 如何从一个 JSON 数据制作 2 个或更多表

相关文章：

html - 使 flexbox 中的元素占据所有垂直和水平空间

jquery - 选择除第一个元素之外的所有子元素

javascript - 给有经验的开发人员第一次尝试 Javascript 的建议

javascript - Facebook edge.create

html - 禁用 Bootstrap 3 单页网站的事件链接样式

javascript - 调整大小时 Div 移出窗口

javascript - 幻灯片放映中的 Zindex 图像

javascript - 匹配 CSS RGB 颜色值

javascript - 使用 FormBuilder Angular 2 绑定(bind)标签值

javascript - jQuery:确定从哪个 <tr> 调用该函数