jQuery

Question

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

假设我有这样的结构

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

其中 .poison-pill 可以是任何地方。我需要 select div 与 class first 或 second 但前提是它不包含 class poison-pill.

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

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

我可以考虑使用 not 功能或 :not select 或其他功能。

Answer 1

您可以将 .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>

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

jQuery - how to select elements not containing specific elelments

jquery-selectors