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

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

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

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

8 ответов


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

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

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

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

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


$(".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.* of jQuery.

в большинстве случаев это самый быстрый $(".member-info").slice(1).hide(); и похоже на соответствующий, а не мозговой штурм ответ


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

например:

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

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


использовать :не() селектор. Например:

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

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

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

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

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

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

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

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


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


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