jQuery - 如何选择不包含特定元素的元素

时间:2016-04-13 07:50:24

标签: jquery jquery-selectors

我正在尝试选择不包含其他元素的元素。

假设我有这样的结构

<div class="wrap">
    <div class="first"></div>
    <div class="second">
        <div class="content">
            <div class="poison-pill"></div>
        </div>
    </div>
</div>

.poison-pill可以在任何地方。我需要选择divfirstsecond,但前提是它不包含类poison-pill的元素。

有没有比在过滤器中使用函数更优雅的方法?

$('.first, .second').filter(function(index, element) {
    return $(element).has('.poison-pill').length === 0;
});

我可以考虑使用not函数或:not选择器或其他东西。

1 个答案:

答案 0 :(得分:2)

您可以将.not():has选择器一起使用:

$('.first, .second').not(':has(.poison-pill)')

$(function(){
  $('.first, .second').not(':has(.poison-pill)').css('background','green');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrap">
    <div class="first">a</div>
    <div class="second">
        <div class="content">
            <div class="poison-pill">b</div>
        </div>
    </div>
</div>