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

У меня

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>

Ответы

Ответ 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 Custom Pseudo-Selectors

Ответ 2

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

Ответ 3

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

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

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

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

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

Ответ 4

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

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

Ответ 5

Селектор хаос дает работу:

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

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

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

Ответ 6

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

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

Ответ 7

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