Не селектор класса в jQuery

272

Есть ли простое выражение выбора, чтобы не выбирать элементы с определенным классом?

<div class="first-foo" />
<div class="first-moo" />
<div class="first-koo" />
<div class="first-bar second-foo" />

Я просто хочу получить первые три деления и попробовал

$(div[class^="first-"][class!="first-bar"])

Но он получает все, так как последний div содержит больше, чем первый бар. Есть ли способ использовать заполнитель в таком выражении? Что-то такое

$(div[class^="first-"][class!="first-bar*"]) // doesn't seem to work

Любые другие селекторы, которые могут помочь?

Zardoz
источник
Вычеркните мой предыдущий комментарий, я просто перечитал вопрос. Критический класс есть first-bar.
BoltClock
Если кто-то хочет выбрать все элементы, которые не имеют ни class1, ни class2, конкатенация сработает:$('div[class^="first-"]').not('.class1').not('.class2')
J0ANMM

Ответы:

545

Вам нужен :not()селектор:

$('div[class^="first-"]:not(.first-bar)')

или, альтернативно, .not()способ:

$('div[class^="first-"]').not('.first-bar');
lonesomeday
источник
91
Обратите внимание: поскольку not () работает в 2-3 раза быстрее, чем .not () ( jsperf.com/jquery-css3-not-vs-not ), вы можете использовать: not (). Однако в документах jQuery рекомендуется использовать .not (), поскольку он более читабелен ( api.jquery.com/not-selector ). Надеюсь, это поможет кому-то принять решение между ними!
Риного
2
@rinogo Теперь быстрее, когда подавляющее большинство браузеров поддерживают querySelectorAll, но так было не всегда.
одинокий
4
Да, именно! :) Я надеюсь, что мой комментарий не встретил критику; Я скорее намеревался добавить к вашему уже полезному вопросу.
Риного
1
Спасибо!! отключить клавишу ввода на всех, кроме моих фильтров. $ ("input: not (.rgFilterBox)"). keydown (function (e) {if (e.keyCode == 13) {return false;} return true;});
hardba11
3
@Daniel, да, но если она есть , то это очень легко изменить , чтобы получить прирост производительности мгновенного :)
rinogo
85

Вы можете использовать :notфильтр выбора:

$('foo:not(".someClass")')

Или not()метод:

$('foo').not(".someClass")

Больше информации:

Sarfraz
источник
3
Значение "должно быть опущено, если вы используете его как селектор CSS.
BoltClock
17
@BoltClock: это необходимо для значений с пробелами в них, я сделал своей привычкой указывать их всегда :)
Sarfraz