Селектор 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()виклику.

— Божангли
джерело

1

@Raynos Я не думаю , що це обов'язково погано , але використовуючи .not()це , далеко краще :not().

— Bojangles

1

Я думаю, це повинно бути $('div:not(#myid)');(без лапок). @Raynos: Чому? :not()є селектором CSS3. jQuery може безпосередньо передати селектор, querySelectorAllякщо підтримується ...

— Фелікс Клінг,

@FelixKling це добре, як частина селекторів4 . Однак у jQuery він повільніший .notі менш читабельний. Я повинен був сказати ": не селектор у jQuery"

— Райнос,

@Raynos: Жодна специфікація селекторів ніколи не допускала котирувань :not(). Цей селектор також не є новинкою для селекторів 4, і він не був змінений, щоб дозволити котирування. Однак його було змінено, щоб дозволити більш складні селектори. Якщо я неправильно зрозумів ваш коментар ...

— BoltClock

1

@PeterKrauss Я щойно зробив тест jsPerf, який позначається querySelectorAllяк найшвидший. Це не реальний орієнтир, але, як очікується, ми не бачимо жодних накладних витрат від jQuery. :not()насправді швидше, мабуть, тому, що Сізл знає, що може оптимізувати його для використання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()with div:not(#myid) швидше ... Чи так?

— Пітер Краус,

8

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

^[doc]

або

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

^[doc]

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

Демонстрацію ви можете побачити тут

— генезис
джерело

Сьогодні (2017), можливо $("div:not(#myid)") , швидше ... Перевірте оптимізацію sizzlejs для нього, коли використовуєте власний Javascript .querySelector()або .querySelectorAll().

— Пітер Краус,

4

   var elements =  $('div').not('#myid');

Сюди будуть входити всі div, крім того, що має ідентифікатор myid

— Ехтешам
джерело

3

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

це те, що вам потрібно, я думаю.

— абхіджіт
джерело

3

Це має зробити це:

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

— iappwebdev
джерело

3

Ви використовуєте .notвластивість бібліотеки jQuery:

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

Подивіться це в дії тут . Div #myDiv буде білим.

— Кайл
джерело