Какой селектор 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>

7 ответов

Решение

Правда в том, что у 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

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

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

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

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

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

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

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

                $('div')
                .filter(function () {

                    return ($(this).parent().not('.baz'));
                })

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

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

Селектор хаоса дает, должен работать:

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

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

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

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

Другие вопросы по тегам