JQuery селектор - все, кроме первого

Question

У меня небольшой вопрос по селекторам jQuery, у меня следующий html:

<div class="member-info first"></div>
<div class="member-info"></div>
<div class="member-info"></div>

Я хочу спрятать (используя jQuery) все div, которые содержат класс "member-info", но не тот, который содержит "первый" класс, какие-нибудь мысли?

Answer 1

$('.member-info:not(.first)').hide();

При этом используются not-selector ^{(документы)} для исключения элементов с классом first.

Или, если цель класса first состоит в том, чтобы просто идентифицировать первое, то вместо этого сделайте следующее:

$('.member-info').slice(1).hide();

Используется метод slice() ^{(документы)} для возврата набора, начинающегося со второго совпадения.

Answer 2

$(".member-info:not('.first')").hide();
$(".member-info").filter(":not('.first')").hide();
$('.member-info').not('.first').hide();

$(".member-info:not(:first)").hide();
$(".member-info").filter(":not(':first')").hide();
$('.member-info').not(':first').hide();

$(".member-info:not(:eq(0))").hide();
$(".member-info").filter(":not(':eq(0)')").hide();
$(".member-info").not(":eq(0)").hide();

$(".member-info:not(:lt(1))").hide();
$(".member-info").filter(":not(':lt(1)')").hide();
$(".member-info").not(":lt(1)").hide();

$(".member-info:gt(0)").hide();
$(".member-info").filter(':gt(0)').hide();

$(".member-info").slice(1).hide();

Все возможные способы, которые приходят мне в голову.Я также сделал сравнение производительности JavaScript , где вы можете найти некоторые неожиданные результаты.

Все эти примеры работают с v1.10. * JQuery.

В большинстве случаев это одинсамый быстрый $(".member-info").slice(1).hide(); и выглядит как актуальный, а не мозговой штурм

Answer 3

Используйте селектор : not () .Например:

$(".member-info:not(first)").hide();

Если первый действительно всегда первый ребенок, попробуйте

$(".member-info:not(member-info:first)").hide();

Answer 4

Это не совсем отвечает на ваш вопрос, но вы можете пропустить первый соответствующий элемент, используя gt.

Например:

$('div.member-info:gt(0)')

См .: http://api.jquery.com/gt-selector/

Answer 5

Я тоже сталкивался с этой проблемой.Однако у меня не было удобного класса с именем first, отмечающего мой элемент для исключения.Вот решение, которое я использовал для селектора в контексте этого примера:

$('.member-info:not(:first)');//grab all .member-info except the first match

Answer 6

@AuthorProxy, @David Thomas и @Maximilian Ehlers все предлагают $('.member-info').not('.first').hide(); в своих ответах, что является очень быстрым и очень читабельным решением.

Из-за способа оценки селекторов jQuery справа налево , вполне читаемый ".member-info:not(.first)" на самом деле замедляется этой оценкой.

Быстрое и простое для чтения решение действительно использует версию функции .not(".first") или даже просто .not(":first"):

, например

$(".member-info").not(".first").hide();   // Class selector

или

$(".member-info").not(":first").hide();   // Positional selector

JSPerf связанных селекторов: http://jsperf.com/fastest-way-to-select-all-expect-the-first-one/6

.not(':first') всего на несколько процентных пунктов медленнее, чем slice(1), но очень хорошо читается как «Я хочу все, кроме первого».

Answer 7

как насчет $('.member-info').not('.first').hide();

Answer 8

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

$('.member-info').not('.first').hide();

Использование not().