Селекторы jQuery - где у элемента нет детей с определенным классом

Question

Я хочу выбрать элементы списка, которые являются непосредственными потомками #nav, которые сами не имеют непосредственных потомков с «активным» классом.

Я думаю, что так и должно быть, но оно не работает:

$('#nav > li:not(> a.active)')

Answer 1

Вот как вы это делаете:

    $('#nav > li:not(:has(a.active))')

Answer 2

Вам нужно будет использовать функцию jQuery filter:

$('#nav > li').filter(function() { return !($(this).children().is('.active')); })

Answer 3

Мне очень нравится решение Кена, но только для альтернативного варианта.

Вы можете добавить активный класс к своим элементам списка вместо ссылок внутри. Тогда ваш селектор может выглядеть так:

$("ul#nav li:not(.active)");

Если вы хотите стилизовать ссылки на основе активного класса, ваш CSS может выглядеть следующим образом:

#nav li.active a{background-color:red;}

Answer 4

Для этого jquery есть селектор not

вы можете сделать что-то вроде

$("#nav > li").children(":not(.active)");