jQuery usuwa wszystkie wiersze tabeli oprócz pierwszego

280

Za pomocą jQuery, jak usunąć wszystkie wiersze w tabeli oprócz pierwszego? To moja pierwsza próba użycia selektorów indeksu. Jeśli dobrze rozumiem przykłady, następujące działania powinny działać:

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

który przeczytałbym jako „Zawiń tabelę w obiekt jQuery, a następnie usuń wszystkie elementy (wiersze)„ tr ”, gdzie indeks takich wierszy jest większy od zera”. W rzeczywistości wykonuje się bez generowania błędu, ale nie usuwa żadnych wierszy z tabeli.

Czego mi brakuje i jak to naprawić? Oczywiście, mógłbym użyć prostego javascript, ale tak dobrze się bawię z jQuery, że chciałbym rozwiązać to za pomocą jQuery.

Ken Paul
źródło
Czy ktoś wie, dlaczego dany kod nie działa? Mam również problem z ustawieniem selektora filtrów w funkcji usuwania
Leto,
1
Teraz, gdy rozumiem to lepiej, powyższy kod nie działa, ponieważ $ (jakiś selektor tabeli) wybiera tylko element table, a nie jego potomne, więc nie ma elementów „tr” do znalezienia przez funkcję remove. Za pomocą funkcji find wyszukuje dopasowania wśród elementów podrzędnych elementu table.
Ken Paul
Spójrz na tę odpowiedź stackoverflow.com/questions/4831334/…
AuthorProxy

Odpowiedzi:

522

To powinno działać:

$(document).ready(function() {
   $("someTableSelector").find("tr:gt(0)").remove();
});
Strelok
źródło
2
Co zrobić, jeśli chcę usunąć wiersze tabeli oprócz pierwszego i drugiego?
18
@ user594166 użyj gt (1) zamiast gt (0).
christianvuerings,
6
Ze strony internetowej jQuery: Because :gt() is a jQuery extension and not part of the CSS specification, queries using :gt() cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use $("your-pure-css-selector").slice(index) instead. Poleciłbym użycie $ ("# mytable> tr"). Slice (1) .remove ();
Chris_F
twój kod nie działał dla mnie. Zmieniłem gt (0) na gt (1) i to zadziałało.
saadk
113

Myślę, że jest to bardziej czytelne, biorąc pod uwagę zamiar:

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

Korzystanie z dzieci dba również o przypadek, w którym pierwszy wiersz zawiera tabelę, ograniczając głębokość wyszukiwania.

Jeśli masz element TBODY, możesz to zrobić:

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

Jeśli masz elementy THEAD lub TFOOT, musisz zrobić coś innego.

tvanfosson
źródło
2
re: zrób coś innego .... to działa:$('someTableSelector > tbody:last > tr:not(:first)').remove();
Cheeso
aby usunąć wszystkie dzieci, musiałem użyć podwójnych cudzysłowów. Nie rozpoznałem tego inaczej. $("#tasks").children().remove();
Doomsknight,
40

Innym sposobem na osiągnięcie tego jest użycie funkcji pustej () jQuery z elementami thead i tbody w tabeli.

Przykład tabeli:

<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>

I polecenie jQuery:

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

Spowoduje to usunięcie wszystkich wierszy zawartych w elemencie tbody tabeli i zachowanie elementu thead w miejscu, w którym powinien znajdować się nagłówek. Może być przydatny, gdy chcesz odświeżyć tylko zawartość tabeli.

jpmorin
źródło
3
Prawdopodobnie będzie to miało najlepszą wydajność ze wszystkich oferowanych rozwiązań i jest bardzo eleganckie.
the.jxc,
38

Gdybym to był ja, prawdopodobnie sprowadziłbym to do jednego selektora:

$('someTableSelector tr:not(:first)').remove();
Dave Ward
źródło
Zgadzam się, ale bardziej konkretnie musi powiedzieć: $ ('someTableSelector tbody tr: not (: first)'). Remove ();
Marco Muciño
30

Twój selektor nie musi znajdować się w środku Twojego usunięcia.

Powinien wyglądać mniej więcej tak:

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

Co oznacza, że ​​zaznacz każdy wiersz oprócz pierwszego w tabeli o identyfikatorze tableID i usuń je z DOM.

CMPalmer
źródło
Zgadzam się. W moim przypadku obiekt tabeli został wcześniej wybrany.
Ken Paul
Aby usunąć wszystkie wiersze oprócz pierwszego: - $ ("# tableID tr: gt (1)"). Remove ();
Biki,
9
$('#table tr').slice(1).remove();

Pamiętam, że natknięcie się na ten „kawałek” jest szybsze niż wszystkie inne podejścia, więc po prostu go tutaj umieść.

Makubex
źródło
Niektóre nie działały dla mnie. Przyjęta odpowiedź wydaje się załatwić sprawę.
ankush981,
gtjest przestarzałe, to najlepsza odpowiedź.
CyberEd
7

Rozważmy tabelę o id tbl: kod jQuery będzie:

$('#tbl tr:not(:first)').remove();
Sanket Utekar
źródło
3

Aby usunąć wszystkie wiersze oprócz pierwszego (oprócz nagłówka), użyj poniższego kodu:

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

Biki
źródło
1

Najprostszy sposób :

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

-pierwsze odwołanie do tabeli
-zbierz listę elementów i pokrój ją i usuń wybrane elementy z listy

Pytholabs
źródło
0

- Przepraszam, to jest bardzo późna odpowiedź.

Najłatwiejszy sposób, jaki udało mi się usunąć dowolny wiersz (i wszystkie inne wiersze poprzez iterację) to

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

Reszta jest łatwa.

Farjad
źródło
0
$ („# p-items”). find ('tr.row-items') .remove ();
Pramod
źródło
0

zawinięte w funkcję:

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

nazwij to:

remove_rows('#table1');
remove_rows('#table2');
PodTech.io
źródło
0

To działa idealnie

$("#myTable tbody").children( 'tr:not(:first)' ).html("");
Infolet.org
źródło
Tak, to było już wcześniej publikowane wiele razy. Nic nowego?
Nico Haase,
0

W moim przypadku działało to w następujący sposób i działało dobrze

$("#compositeTable").find("tr:gt(1)").remove();
saadk
źródło