用JS复制最后一行表格
时间: 2023-09-18 10:11:40 浏览: 42
以下是使用JS复制最后一行表格的示例代码:
```html
<!--HTML表格-->
<table id="myTable">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>Gender</th>
</tr>
</thead>
<tbody>
<tr>
<td>John Doe</td>
<td>25</td>
<td>Male</td>
</tr>
<tr>
<td>Jane Doe</td>
<td>30</td>
<td>Female</td>
</tr>
<tr>
<td>Bob Smith</td>
<td>35</td>
<td>Male</td>
</tr>
</tbody>
</table>
<!--JS代码-->
<script>
const table = document.getElementById('myTable');
const lastRow = table.rows[table.rows.length - 1]; // 获取最后一行
const newRow = lastRow.cloneNode(true); // 克隆最后一行
table.tBodies[0].appendChild(newRow); // 将克隆的最后一行添加到表格末尾
</script>
```
这段代码将复制表格最后一行,并将其添加到表格的末尾。注意,这里使用了`cloneNode()`方法来克隆最后一行,因为直接复制会导致所有单元格的事件处理程序、样式等被一起复制。
相关推荐
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)