web-dev-qa-db-ja.com

jQueryが最初を除いてのテーブル行を削除する

JQueryを使用して、最初のテーブル以外のテーブル内のすべての行を削除する方法を教えてください。これが私の最初のインデックスセレクター使用の試みです。例を正しく理解すれば、次のようになります。

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

私は「jQueryオブジェクトでテーブルをラップしてから、そのような行の要素インデックスが0より大きい 'tr'要素（行）をすべて削除する」と読みました。実際には、エラーを生成せずに実行されますが、テーブルから行を削除することはありません。

何が足りないのでしょう、そしてどうすればこれを修正できますか？もちろん、私はストレートのJavaScriptを使用することができますが、私はjQueryを使ってこれを解決したいのでjQueryをとても楽しんでいます。

jqueryjquery-selectors
269
Ken Paul

これはうまくいくはずです。

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

私の考えでは、これはもっと読みやすいと思います。

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

子を使用すると、最初の行に検索の深さを制限することによってテーブルが含まれる場合も処理されます。

もしあなたがTBODY要素を持っていたら、あなたはこれをすることができます：

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

THEADまたはTFOOT要素がある場合は、別のことをする必要があります。

108
tvanfosson

これを実現するもう1つの方法は、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要素が保持されます。テーブルの内容だけを更新したい場合に便利です。

37
jpmorin

それが私ならば、私はおそらくそれを単一のセレクターにまとめるでしょう。

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

あなたのセレクタはあなたの削除の中にある必要はありません。

次のようになります。

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

これは、tableIDというIDを持つテーブルの最初の行を除くすべての行を選択し、それらをDOMから削除することを意味します。

29
CMPalmer

IDがtblのテーブルを考えます。jQueryコードは次のようになります。

$('#tbl tr:not(:first)').remove();
6
Sanket Utekar
$('#table tr').slice(1).remove();

私はその「スライス」に遭遇するのが他のすべてのアプローチより速いので覚えているので、それをここに置くだけです。

6
Makubex

最初の行（ヘッダーを除く）を除くすべての行を削除するには、次のコードを使用します。

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

1
Biki

これは完璧に動作します

$("#myTable tbody").children( 'tr:not(:first)' ).html("");
0
Infolet.org
 
 $（ "＃p-items"）。find（ 'tr.row-items'）.remove（）;
0
Pramod

これは私の場合は次のように動作し、問題なく動作しました。

$("#compositeTable").find("tr:gt(1)").remove();
0
saadk

関数に包まれて：

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

それを呼び出します：

remove_rows('#table1');
remove_rows('#table2');
0
PodTech.io

- ごめんなさい。

私が見つけた最も簡単な方法は任意の行（そして繰り返しを通して他のすべての行）を削除することです

$（ '＃rowid'、 '＃tableid'）。remove（）;

あとは簡単です。

0
Farjad

最も簡単な方法：

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

- テーブルの最初の参照
- 要素のリストを取得してスライスし、リストから選択した要素を削除します

0
Pytholabs