jQuery删除除第一行以外的所有表格行

Question

使用 jQuery，我如何删除表格中除第一行外的所有行？这是我首次尝试使用索引选择器。如果我正确理解了示例，以下代码应该可以实现：

$(some table selector).remove("tr:gt(0)");

我会读成“将一些表格包装在jQuery对象中，然后删除其中元素索引大于零的所有'tr'元素（即行）”。实际上，它可以正常执行，但不会从表格中删除任何行。

我错过了什么，如何解决这个问题？当然，我可以使用纯JavaScript，但我正在享受使用jQuery带来的乐趣，所以我想用jQuery解决这个问题。

- Ken Paul

---

有人知道为什么给定的代码不起作用吗？当我将筛选器选择器放在删除函数中时，我也遇到了问题。 - Leto

现在我更好地理解了，上面的代码不起作用是因为$(某个表选择器)仅选择表元素，而不选择其任何子元素，因此没有'tr'元素供删除函数查找。使用find函数在表元素的子元素中搜索匹配项。 - Ken Paul

看看这个答案：https://dev59.com/mlPTa4cB1Zd3GeqPmtKZ#18322370 - AuthorProxy

Answer 1

这应该可以工作：

$(document).ready(function() {
   $("someTableSelector").find("tr:gt(0)").remove();
});

- Strelok

---

如果我想删除表格行，除了第一行和第二行，该怎么办？ - user594166

请使用 gt(1) 替代 gt(0)。 - christianvuerings

来自jQuery网站： 由于:gt()是jQuery的扩展，而不是CSS规范的一部分，使用:gt()的查询无法利用原生DOM querySelectorAll()方法提供的性能提升。为了在现代浏览器中获得更好的性能，请改用$("your-pure-css-selector").slice(index)。我建议使用$("#mytable > tr").slice(1).remove(); - Chris_F

你的代码对我没用，我把 gt(0) 改成了 gt(1)，这样就可以了。 - saadk

Answer 2

我认为这更易读，符合意图：

$('someTableSelector').children( 'tr:not(:first)' ).remove();

使用子元素也可以解决第一行包含表格的情况，通过限制搜索深度来实现。

如果你有一个TBODY元素，你可以这样做：

$("someTableSelector > tbody:last").children().remove();

如果你有THEAD或TFOOT元素，你需要做一些不同的事情。

- tvanfosson

---

回复：做点不同的事情...这个可以用：$（'someTableSelector > tbody:last > tr:not(:first)'）.remove(); - Cheeso

为了删除所有子元素，我不得不使用双引号。否则无法识别。$("#tasks").children().remove(); - IAmGroot

Answer 3

另一种实现方法是使用jQuery的empty()函数与表格中的thead和tbody元素。

示例表格：

<table id="tableId">
<thead>
    <tr><th>Col1</th><th>Col2</th></tr>
</thead>
<tbody>
    <tr><td>some</td><td>content</td></tr>
    <tr><td>to be</td><td>removed</td></tr>
</tbody>
</table>

并且这个jQuery命令：

$("#tableId > tbody").empty();

这将删除表格tbody元素中包含的所有行，保留thead元素作为标头。当您只想刷新表格的内容时，它可能非常有用。

- jpmorin

---

这可能会是所有提供的解决方案中表现最佳且非常优雅的一种。 - the.jxc

Answer 4

如果是我，我可能会将它简化为一个选择器：

$('someTableSelector tr:not(:first)').remove();

- Dave Ward

---

同意，但更具体地说，它必须是：$('someTableSelector tbody tr:not(:first)').remove(); - Marco Muciño

Answer 5

你的选择器不需要放在 remove() 方法里面。

应该长成这样：

$("#tableID tr:gt(0)").remove();

意思是选择ID为tableID的表格中除第一行以外的所有行，并将它们从DOM中移除。

- CMPalmer

---

我同意。在我的情况下，表对象已经被先前选择了。 - Ken Paul

删除除第一行以外的所有行： $（“#tableID tr:gt(1)”）.remove(); - Biki

Answer 6

$('#table tr').slice(1).remove();

我记得看到过说“切片”比其他方法更快，所以就把它放在这里。

- Makubex

---

有些方法对我不起作用。被接受的答案似乎解决了问题。 - ankush981

gt已经被弃用，这是最佳答案。 - CyberEd

Answer 7

考虑一个id为tbl的表格：jQuery代码应该是这样的：

$('#tbl tr:not(:first)').remove();

- Sanket Utekar

Answer 8

要删除除首行（头部）以外的所有行，请使用以下代码：$("#dataTable tr:gt(1)").remove();。

- Biki

Answer 9

最简单的方法：

$("#mytable").find($("tr")).slice(1).remove()

-首先引用表格
-获取元素列表并对其进行切片，并删除列表中选择的元素

- Pytholabs

Answer 10

这个完美地工作了

$("#myTable tbody").children( 'tr:not(:first)' ).html("");

- Aslam Kakkove

---

这个已经被多次发布过了。有什么新的吗？ - Nico Haase