📅  最后修改于: 2023-12-03 14:49:28.279000             🧑  作者: Mango
当我们使用 jQuery 操作表格时,有时需要删除表格中的一行数据。本文将介绍如何使用 jQuery 从表格中删除第一行数据。
首先,我们需要准备一张 HTML 表格,如下所示:
<table id="myTable">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>18</td>
</tr>
<tr>
<td>李四</td>
<td>20</td>
</tr>
<tr>
<td>王五</td>
<td>22</td>
</tr>
</tbody>
</table>
我们可以使用 jQuery 的 eq()
方法获取表格中的第一行,使用 remove()
方法将其从文档中删除。
$(document).ready(function() {
$('#myTable tbody tr').eq(0).remove();
});
该代码将删除表格中的第一行数据。我们使用 $(document).ready()
方法,确保当页面加载完成后再执行删除操作。
下面是完整的 HTML 文件示例,其中包含了上述代码和表格 HTML。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>删除表格中的第一行数据</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$('#myTable tbody tr').eq(0).remove();
});
</script>
</head>
<body>
<table id="myTable">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>18</td>
</tr>
<tr>
<td>李四</td>
<td>20</td>
</tr>
<tr>
<td>王五</td>
<td>22</td>
</tr>
</tbody>
</table>
</body>
</html>
使用 jQuery 删除表格中的第一行非常简单,只需使用 eq()
方法获取第一行,再使用 remove()
方法将其从文档中删除即可。