«Все, но не» селектор jQuery

#javascript #jquery #jquery-selectors

#javascript #jquery #jquery-селекторы

Вопрос:

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

 $('div')
 

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

Как я могу это сделать, используя функции Jquery?

Комментарии:

1. используйте селектор not в jquery

Ответ №1:

Простой:

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

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

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

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

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

Комментарии:

1. @Raynos Я не думаю, что это обязательно плохо , но использование .not() намного, намного лучше, чем :not() .

2. Я думаю, что это должно быть $('div:not(#myid)'); (без кавычек). @Raynos: Почему? :not() является селектором CSS3. jQuery может напрямую передавать селектор querySelectorAll , если поддерживается…

3. @FelixKling это нормально как часть selectors4 . Однако в jQuery это медленнее .not и менее читаемо. Я должен был сказать «: не селектор в jQuery»

4. @Raynos: никакая спецификация селекторов никогда не допускала кавычек внутри :not() . Этот селектор не является новым для селекторов 4 и не был изменен, чтобы разрешить кавычки. Однако он был изменен, чтобы разрешить более сложные селекторы. Если я не неправильно понял ваш комментарий…

5. @PeterKrauss Я только что выполнил тест jsPerf , который отмечен querySelectorAll как самый быстрый. Не является эталоном в реальном мире, но этого следовало ожидать, поскольку от jQuery internal нет накладных расходов. :not() на самом деле быстрее, вероятно, потому, что Sizzle знает, что он может оптимизировать его для использования querySelectorAll()

Ответ №2:

 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) быстрее… Так ли это?

Ответ №3:

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

[документ]

или

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

[документ]

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

Вы можете посмотреть демонстрацию здесь

Комментарии:

1.Сегодня (2017), возможно, $("div:not(#myid)") быстрее… Проверьте оптимизацию sizzlejs для этого, при использовании собственного Javascript .querySelector() или .querySelectorAll() .

Ответ №4:

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

Это будет включать в себя все подразделения, кроме одного с идентификатором ‘myid’

Ответ №5:

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

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

Ответ №6:

Это должно сделать это:

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

Ответ №7:

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

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

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