Seleccione todos los elementos secundarios excepto el primero

81

Digamos que tengo lo siguiente:

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

¿Cómo seleccionaría todos los elementos secundarios después del primero usando jQuery? Entonces puedo lograr algo como:

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

Respuestas:

36

Basado en mi análisis totalmente poco científico de los cuatro métodos aquí, parece que no hay mucha diferencia de velocidad entre ellos. Ejecuté cada uno en una página que contenía una serie de listas desordenadas de diferente longitud y las cronometré usando el generador de perfiles de Firebug.

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

Tiempo promedio: 5.322ms

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

Tiempo promedio: 5.590ms

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

Tiempo promedio: 6.084ms

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

Tiempo promedio: 7.831ms

twernt
fuente
3
Me encontré con esta pregunta porque necesitaba tener todos los niños menos el primero. Estaba haciendo esto en todos los h3 que estaban en un div. Ejecuté tres de las consultas que tenía anteriormente en mi página y salí con: not (: first-child) como el más rápido en 2-3 veces. Creo que la forma en que está estructurada su página también puede influir en la velocidad del perfil. De cualquier manera, esta respuesta me enseñó cómo usar el generador de perfiles Firebug y te agradezco por eso.
RedWolves
13

http://docs.jquery.com/Traversing/slice

$("li").slice(1).addClass("something");
Jonny Buchanan
fuente
Esta es una buena respuesta, pero creo que lo que seleccioné como respuesta es el uso más explícito. Cualquier persona nueva en el proyecto comprenderá más rápidamente lo que se está haciendo en el selector.
Chris Canal
9

Una consulta más elegante (seleccione todos los elementos li que están precedidos por un elemento li):

$('ul li+li')

Sergey Ilinsky
fuente
1
$ ("li + li") probablemente funcionará más rápido que $ ("li: no (: primer hijo)")
Sergey Ilinsky
3

yo usaría

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

Esto debería funcionar

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

Esto es lo que tengo trabajando hasta ahora

$('.certificateList input:checkbox:gt(0)')
Chris Canal
fuente
0

Utilice el método jQuery .not ()

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

O

var firstElement = $('li').first();
$('li').not(firstElement).addClass('something');
aalov
fuente