jQuery – “不包含元素”的规则

我想创建一个规则来定位以下内容中的一个元素：

<ul id="root">
   <li>
      <a href="item.html">Root Menu Item</a>
   </li>
</ul>

但是，如果li元素包含另一个ul元素，那么这不应用，例如：

<ul id="root">
   <li>
      <a href="#">Sub Menu</a>
      <ul>
         <li>
            <a href="item.html">Sub Menu Item</a>
        </li>
      </ul>
   </li>
</ul>

我根据需要创建了事件，但需要它才能在“根”菜单项上工作。

我知道我可以添加一个id属性来定位所需的元素，但是我的客户端安装的菜单插件是不容易配置的。

解决方法

如果你匹配a做这个：

var result  = $('#root > li:not(:has(ul)) > a');

> http://api.jquery.com/not-selector/
> http://api.jquery.com/has-selector/

如果你想允许更深入的嵌套< ul>元素，只是想检查，以确保只有直接的孩子没有< ul>，你可以这样做：

var result  = $('#root > li:not(:has(> ul)) > a');

编辑：

要同时拥有多个选择器，请用引号内的逗号分隔它们：

var result  = $('#root > li:not(:has(> ul)) > a,#someOtherElement');