293

使用 jQuery,如何删除表中除第一行之外的所有行?这是我第一次尝试使用索引选择器。如果我正确理解了这些示例,则以下内容应该有效:

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

我将其读作“在 jQuery 对象中包装一些表,然后删除这些行的元素索引大于零的所有 'tr' 元素(行)”。实际上,它执行时不会产生错误,但不会从表中删除任何行。

我错过了什么,我该如何解决?当然,我可以直接使用 javascript,但是我对 jQuery 非常感兴趣,所以我想使用 jQuery 来解决这个问题。

4

14 回答 14

541

这应该有效:

$(document).ready(function() {
   $("someTableSelector").find("tr:gt(0)").remove();
});
于 2008-12-15T23:12:38.847 回答
116

考虑到意图,我认为这更具可读性:

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

使用 children 还可以通过限制搜索的深度来处理第一行包含表的情况。

如果你有一个 TBODY 元素,你可以这样做:

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

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

于 2008-12-15T23:35:20.423 回答
49

另一种方法是使用 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 元素保留在标题应位于的位置。当您只想刷新表格的内容时,它会很有用。

于 2011-11-08T16:39:19.267 回答
39

如果是我,我可能会把它归结为一个选择器:

$('someTableSelector tr:not(:first)').remove();
于 2008-12-16T14:30:55.017 回答
30

您的选择器不需要在您的移除中。

它应该看起来像:

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

这意味着选择表中 ID 为 tableID 的除第一行之外的每一行,并将它们从 DOM 中删除。

于 2008-12-15T23:14:19.607 回答
10
$('#table tr').slice(1).remove();

我记得遇到“切片”比所有其他方法都快,所以把它放在这里。

于 2013-06-25T08:46:08.107 回答
7

考虑一个带有 id 的表tbl:jQuery 代码将是:

$('#tbl tr:not(:first)').remove();
于 2012-03-10T08:46:14.727 回答
3

要删除除第一行(标题除外)之外的所有行,请使用以下代码:

$("#dataTable tr:gt(1)").remove();

于 2015-12-03T11:27:40.837 回答
1

最简单的方法:

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

-首先引用表格
-获取元素列表并将其切片并删除列表中的选定元素

于 2019-05-24T09:56:13.010 回答
0

-对不起,这是很晚的回复。

我发现删除任何行(以及通过迭代的所有其他行)的最简单方法是这样

$('#rowid','#tableid').remove();

其余的很容易。

于 2013-09-21T18:41:19.990 回答
0
$("#p-items").find('tr.row-items').remove();
于 2014-03-08T09:00:43.667 回答
0

包装在一个函数中:

function remove_rows(tablename) { 
    $(tablename).find("tr:gt(0)").remove();        
}

然后调用它:

remove_rows('#table1');
remove_rows('#table2');
于 2016-11-18T19:48:55.170 回答
0

这完美地工作

$("#myTable tbody").children( 'tr:not(:first)' ).html("");
于 2018-02-07T08:58:38.697 回答
0

在我的情况下,这以以下方式工作并且工作正常

$("#compositeTable").find("tr:gt(1)").remove();
于 2018-05-16T12:39:15.137 回答