Wählen Sie alle untergeordneten Elemente außer dem ersten aus


81

Angenommen, ich habe Folgendes:

<ul>
 <li>First item</li>
 <li>Second item</li>
 <li>Third item</li>
</ul>

Wie würde ich mit jQuery alle untergeordneten Elemente nach dem ersten auswählen? So kann ich etwas erreichen wie:

<ul>
 <li>First item</li>
 <li class="something">Second item</li>
 <li class="something">Third item</li>
</ul>

Antworten:



36

Basierend auf meiner völlig unwissenschaftlichen Analyse der vier Methoden hier sieht es so aus, als gäbe es keinen großen Geschwindigkeitsunterschied zwischen ihnen. Ich habe jede Seite auf einer Seite mit einer Reihe ungeordneter Listen unterschiedlicher Länge ausgeführt und sie mit dem Firebug-Profiler zeitlich festgelegt.

$("li").slice(1).addClass("something");

Durchschnittliche Zeit: 5,322 ms

$("li:gt(0)").addClass("something");

Durchschnittliche Zeit: 5,590 ms

$("li:not(:first-child)").addClass("something");

Durchschnittliche Zeit: 6,084 ms

$("ul li+li").addClass("something");

Durchschnittliche Zeit: 7,831 ms


3
Ich bin auf diese Frage gestoßen, weil ich alle Kinder außer dem ersten bekommen musste. Ich habe das auf allen h3 gemacht, die in einem Div waren. Ich habe drei der Abfragen ausgeführt, die Sie oben auf meiner Seite hatten, und habe festgestellt, dass: nicht (: erstes Kind) 2-3 Mal die schnellste ist. Ich denke, die Art und Weise, wie Ihre Seite strukturiert ist, kann sich auch auf die Profilgeschwindigkeit auswirken. In beiden Fällen hat mir diese Antwort den Umgang mit dem Firebug-Profiler beigebracht, und ich danke Ihnen dafür.
RedWolves


9

Eine elegantere Abfrage (wählen Sie alle li-Elemente aus, denen ein li-Element vorangestellt ist):

$('ul li+li')


1
$ ("li + li") wird wahrscheinlich schneller arbeiten als $ ("li: not (: erstes Kind)")
Sergey Ilinsky

3

Ich würde verwenden

$("li:gt(0)").addClass("something");

2

Das sollte funktionieren

$('ul :not(:first-child)').addClass('something');

1

Das ist es, woran ich bisher gearbeitet habe

$('.certificateList input:checkbox:gt(0)')

0

Verwenden Sie die Methode jQuery .not ()

$('li').not(':first').addClass('something');

ODER

var firstElement = $('li').first();
$('li').not(firstElement).addClass('something');
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.