Выберите все дочерние элементы, кроме первого

83

Скажем, у меня есть следующее:

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

Как выбрать все дочерние элементы после первого с помощью jQuery? Итак, я могу добиться чего-то вроде:

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

javascript jquery

— Крис Канал
источник

138

Вы должны уметь использовать селекторы «не» и «первый ребенок».

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

http://docs.jquery.com/Selectors/not

http://docs.jquery.com/Selectors/firstChild

— тёрнт
источник

Я пробовал это: $ ('. CertificateList input: checkbox: not (: first-child)'), но это не сработало ....

— Крис Канал,

Будет ли это медленнее, чем метод Slice, указанный ниже?

— Крис Марасти-Георг,

36

Основываясь на моем совершенно ненаучном анализе этих четырех методов, похоже, что между ними нет большой разницы в скорости. Я запускал каждый на странице, содержащей серию неупорядоченных списков разной длины, и рассчитывал их по времени с помощью профилировщика Firebug.

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

Среднее время: 5,322 мс

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

Среднее время: 5.590 мс

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

Среднее время: 6.084 мс

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

Среднее время: 7,831 мс

— тёрнт
источник

3

Я столкнулся с этим вопросом, потому что мне нужно было получить всех детей, кроме первого. Я делал это на всех h3, которые были в div. Я выполнил три запроса, как у вас, на моей странице, и получил: not (: first-child) как самый быстрый в 2-3 раза. Я думаю, что то, как структурирована ваша страница, также может влиять на скорость профиля. В любом случае, этот ответ научил меня использовать профилировщик Firebug, и я благодарю вас за это.

— RedWolves,

13

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

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

— Джонни Бьюкенен
источник

Это хороший ответ, но я чувствую, что выбрал в качестве ответа более явное использование. Любой новичок в проекте будет быстрее понимать, что делается в селекторе.

— Крис Канал,

9

Более элегантный запрос (выберите все элементы li, которым предшествует элемент li):

$('ul li+li')

— Сергей Ильинский
источник

1

$ ("li + li"), скорее всего, будет работать быстрее, чем $ ("li: not (: first-child)")

— Сергей Ильинский

3

я бы использовал

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

— Игну
источник

2

Это должно работать

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

— Пэт
источник

1

Это то, над чем я работаю до сих пор

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

— Крис Канал
источник

0

Используйте метод jQuery .not ()

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

ИЛИ ЖЕ

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

— Аалов
источник