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

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

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

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

Ответ 1

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

Здесь используется not-selector (docs), чтобы исключить элементы с first класс.

Или, если цель класса first - это просто определить первое, тогда сделайте это вместо:

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

Это использует метод slice() (docs), чтобы вернуть набор начиная со второго матча.

Ответ 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(); и выглядит как релевантный, а не мозговой штурм.

Ответ 3

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

Например:

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

Смотрите: http://api.jquery.com/gt-selector/

Ответ 4

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

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

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

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

Ответ 5

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

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

Ответ 6

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

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

Используя not().

Ответ 7

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

Ответ 8

@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), но очень читается как "Я хочу все, кроме первого".