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