Какой селектор JQuery исключает элементы с родителем, который соответствует данному селектору?

Question

у меня

var $set = $('.foo,.bar').filter(
    function() {return $(this).parents('.baz').length < 1;});

как способ выбора всех элементов, классы которых foo или bar и которые не происходят от элемента, класс которого baz. Есть ли селектор, который будет выполнять то же самое без необходимости фильтрации лямбда?

<div class='foo'/><!--match this-->
<div class='bar'/><!--match this-->
<div class='baz'>
    <div class='foo'/> <!--don't match this-->
</div>

Answer 1

Правда в том, что у jQuery просто нет особенно элегантного способа делать то, что вы хотите. Несмотря на то, что ответ хаоса работает, вы должны задаться вопросом, стоит ли сложный селектор (который будет примерно таким же медленным, как селектор на сложной веб-странице) по сравнению с более подробной, но более быстрой функцией фильтрации, которую вы имеете. Это на самом деле не так уж важно, я просто устаю от особенно длинных, запутанных селекторов, когда я могу этого избежать.

Другой вариант - создать свой собственный селектор, поскольку jQuery потрясающий:

jQuery.expr[':'].parents = function(a,i,m){
    return jQuery(a).parents(m[3]).length < 1;
};

$('.foo,.bar').filter(':parents(.baz)');

Карта expr является частью механизма выбора Sizzle, и документацию можно найти здесь: Пользовательские псевдо-селекторы Sizzle

Answer 2

$('.foo:not(.baz .foo),.bar:not(.baz .bar)')

Answer 3

Я не мог заставить это работать:

$(".children:not(#parent .children)");

Но я могу заставить это работать:

$(".children").not($("#parent .children"));

Примечание: не уверен, что это как-то связано с версией jQuery, которую я использую 1.2.6

Answer 4

попробуйте это:

$('div').filter(function () {
  return ($(this).parent().not('.baz'));
})

Answer 5

var $li = jQuery('li', this).not('.dropdown-menu > li');

Я использую тему Roots, и они меняют выпадающие меню с «подменю» на «.dropdown-menu»

Answer 6

Срабатывает селектор Хаос :

$('.foo:not(.baz .foo),.bar:not(.baz .bar)')

Просто хотел дать вам совет о расширении FireBug под названием FireFinder , которое вы можете использовать для проверки ваших селекторов css / jquery.

С веб-сайта: Firefinder является расширением Firebug (в Firefox) и предлагает функциональные возможности для быстрого поиска элементов HTML, соответствующих выбранному селектору (ам) CSS или выражению XPath. Это позволяет вам мгновенно тестировать ваши CSS-селекторы на странице, одновременно просматривая контент, и соответствующие элементы будут выделены.

Answer 7

Добавьте a: not ('. Baz') в ваш селектор верхнего уровня.