Предположим, что у меня есть следующий HTML:
<div class="foo">
<ul>
<li>One</li>
<li>Two</li>
</ul>
</div> <!-- not originally here -->
<div class="bar">
<ul>
<li>Three</li>
<li>Four</li>
</ul>
</div>
Я хочу выделить все элементы li
, которые не являются потомками элемента с классом foo
. Я знаю, что могу сделать это с помощью fancy функции фильтрации, но мне интересно, могу ли я сделать это с помощью только селектора. Сначала я попробовал:
$(":not(.foo) li")
К сожалению, это не работает, поскольку li
имеет других предков без стиля (в этом случае ul
). Кажется, что работает следующее:
$(":not(.foo) :not(.foo) li")
Другими словами, выберите все элементы li
, у которых нет предка, который либо имеет класс foo
, либо имеет собственный предок с классом foo
. Возможно, это лучший/единственный способ сделать это с помощью селектора, но я не в восторге от повторения селектора :not
. Какие-нибудь лучшие идеи там?