js怎么实现表格的行追加 655Z技术栈

要在JavaScript中实现表格的行追加，你可以使用以下方法：

使用insertRow()方法在表格中插入新行。

var table = document.getElementById("myTable"); var row = table.insertRow(); // 在表格末尾插入新行

使用insertCell()方法在行中插入新单元格。

var cell1 = row.insertCell(); // 在新行中插入第一个单元格 var cell2 = row.insertCell(); // 在新行中插入第二个单元格

使用innerHTML属性设置单元格的内容。

cell1.innerHTML = "Cell 1"; // 设置第一个单元格的内容 cell2.innerHTML = "Cell 2"; // 设置第二个单元格的内容

完整的代码示例：

<table id="myTable"> <tr> <th>Header 1</th> <th>Header 2</th> </tr> <tr> <td>Cell 1</td> <td>Cell 2</td> </tr> </table> <button onclick="addRow()">Add Row</button> <script> function addRow() { var table = document.getElementById("myTable"); var row = table.insertRow(); // 在表格末尾插入新行 var cell1 = row.insertCell(); // 在新行中插入第一个单元格 var cell2 = row.insertCell(); // 在新行中插入第二个单元格 cell1.innerHTML = "Cell 1"; // 设置第一个单元格的内容 cell2.innerHTML = "Cell 2"; // 设置第二个单元格的内容 } </script>

当点击"Add Row"按钮时，将会在表格中添加一行，并填充两个单元格的内容为"Cell 1"和"Cell 2"。

提供PHP及ThinkPHP框架的定制开发、代码优化，PHP修改、ThinkPHP修改。

邮箱：yvsm@163.com 微信：yvsm316 QQ：316430983

本文地址：https://www.655z.com/javascript/view_251763.html

Tags：追加表格