选择元素,除非它只使用选择器具有给定类的祖先

Question

假设我有以下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.我知道我可以用一个花哨的过滤器功能来做到这一点,但我想知道我是否可以只使用一个选择器.首先我试过:

$(":not(.foo) li")

不幸的是,这不起作用,因为li有其他祖先没有风格(ul在这种情况下).以下似乎有效;

$(":not(.foo) :not(.foo) li")

换句话说,选择所有li没有祖先的元素,这些祖先具有类foo或者具有类的祖先foo.也许这是使用选择器执行此操作的最佳/唯一方法,但我对:not选择器的重复感到不满.还有更好的想法吗？

小提琴

Answer 1

你可以这样做

$("li").not('.foo li')

http://jsfiddle.net/y7s54/

要么

$("li:not(.foo li)")

http://jsfiddle.net/QpCYY/

选择所有没有类foo的祖先的li