如何选择里面没有链接的元素?

Hom*_*man 6 jquery jquery-selectors dom-traversal

鉴于此HTML:

<ul>
  <li><a href="/artists/gil_elvgren/activity_stream">Activity Stream</a></li>
  <li><a href="/artists/gil_elvgren/likes">Likes</a></li>
  <li>Favorites</li>
  <li><a href="/artists/gil_elvgren/follows">Follows</a></li>
  <li><a href="/artists/gil_elvgren/sketchbook_comments">Whiteboard</a></li>

</ul>
Run Code Online (Sandbox Code Playgroud)

我想将注入class="current"到其中没有链接的单行项目中.

如何使用jQuery查找不包含子元素的元素?

Kru*_*ule 8

选择<li>一个没有元素<a>使用子:has:not选择:

$("li:not(:has(a))").addClass("current");
Run Code Online (Sandbox Code Playgroud)

的jsfiddle

- 编辑 -

虽然这可能是最短的解决方案,除了可读性之外,它绝对不是速度方面最好的解决方案.

考虑到这一点,我建议你查看@bazmegakapa提供的一个很好的答案.

由于这是你(或包括我在内的任何人)可能不止一次使用的东西,我使用这个插件/方法扩展了jQuery,你可以使用它来你的代码:

jQuery.fn.thatHasNo = function(element, method) {
  if (typeof method === "undefined" || method === null) method = "children";
  return this.not(function() {
    return $(this)[method](element).length;
  });
};
Run Code Online (Sandbox Code Playgroud)

你可以打电话给:

$("li").thatHasNo("a").addClass("current");
Run Code Online (Sandbox Code Playgroud)

默认情况下(如果未传递方法的第二个参数),此扩展将检查是否存在与提供的选择器匹配的任何直接后代(子项).但是,您可以提供任何树遍历参数作为方法的第二个参数.因此,这可以写成以下任一项:

$("li").thatHasNo("a", "children").addClass("current");
//...
$("li").thatHasNo("a", "find").addClass("current");
//...
$("li").thatHasNo(".class", "siblings").addClass("lame");
Run Code Online (Sandbox Code Playgroud)

我已经更新了jsFiddle来反映这一点.


box*_*owh 0

$("li").each(function(){
    if($(this).children().length == 0){
        //found current..
        $(this).addClass("current");
    }
});
Run Code Online (Sandbox Code Playgroud)