Селектор jQuery "Все, но не"

89

Я могу выбрать (с помощью jQuery) все div в разметке HTML следующим образом:

$('div')

Но я хочу исключить конкретное div(например, имеющее id="myid") из приведенного выше выбора.

Как я могу сделать это с помощью функций JQuery?

javascript jquery jquery-selectors siva636
источник
2
используйте селектор not в jquery
abhijit

Ответы:

171

Просто:

$('div').not('#myid');

Использование .not()удалит элементы, соответствующие заданному ему селектору, из набора, возвращаемого $('div').

Вы также можете использовать :not()селектор:

$('div:not(#myid)');

Оба селектора делают одно и то же, но работают :not()быстрее , по-видимому, потому, что движок селекторов jQuery Sizzle может оптимизировать его до нативного .querySelectorAll()вызова.

Bojangles
источник
1
@Raynos Я не думаю , что это обязательно плохо , но используя .not()это , далеко лучше :not().
Bojangles
1
Думаю, так и должно быть $('div:not(#myid)');(без кавычек). @ Райнос: Почему? :not()это селектор CSS3. jQuery может напрямую передавать селектор, querySelectorAllесли поддерживается ...
Феликс Клинг,
@FelixKling нормально в составе селекторов4 . Однако в jQuery он медленнее .notи менее читабелен. Я должен был сказать: «Не селектор в jQuery»
Рейнос
@Raynos: Спецификация Selectors никогда не позволяла использовать кавычки внутри :not(). Этот селектор не является новым для Selectors 4 и не был изменен, чтобы разрешить кавычки. Однако он был изменен, чтобы разрешить более сложные селекторы. Если я не неправильно понял ваш комментарий ...
BoltClock
1
@PeterKrauss Я только что провел тест jsPerf, который считаетсяquerySelectorAll самым быстрым. Не реальный тест, но этого следовало ожидать, так как нет накладных расходов от внутреннего jQuery. :not()на самом деле быстрее, предположительно потому, что Sizzle знает, что может оптимизировать его для использованияquerySelectorAll()
Bojangles
9 
var els = toArray(document.getElementsByTagName("div"));
els.splice(els.indexOf(document.getElementById("someId"), 1);

Вы могли бы просто сделать это по старинке. Нет необходимости в jQuery с чем-то таким простым.

Советы профессионалов:

Набор элементов dom - это просто массив, поэтому используйте свой любимый toArrayметод для NodeList.

Добавление элементов в набор - это просто

set.push.apply(set, arrOfElements);

Удаление элемента из набора - это

set.splice(set.indexOf(el), 1)

Вы не можете легко удалить сразу несколько элементов :(

Райнос
источник
1
В настоящее время (2017 год), возможно, быстрее используется собственный Javascript .querySelector()или .querySelectorAll()с ... Не так ли? div:not(#myid)
Питер Краусс
8 
$("div:not(#myid)")

[док]

или

$("div").not("#myid")

[док]

основные способы выбрать все, кроме одного идентификатора

Вы можете увидеть демо здесь

генезис
источник
Сегодня (2017), возможно $("div:not(#myid)") , быстрее ... Проверьте оптимизацию sizzlejs при использовании собственного Javascript .querySelector()или .querySelectorAll().
Питер Краусс
4 
   var elements =  $('div').not('#myid');

Это будет включать все div, кроме одного с идентификатором myid

Ehtesham
источник
3 
$('div:not(#myid)');

я думаю, это то, что вам нужно.

абхиджит
источник
3

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

$('div:not("#myid")')
iappwebdev
источник
3

Вы используете .notсвойство библиотеки jQuery:

$('div').not('#myDiv').css('background-color', '#000000');

Посмотрите это в действии здесь . Div #myDiv будет белым.

Кайл
источник