获取没有一个孩子有某一类的所有父母

Question

我要选择使用jQuery父母的所有div的，没有孩子的类locked

示例代码：

<div class='myparent'> 
    <div class='mychild locked'></div> 
</div> 
<div class='myparent'> 
    <div class='mychild locked'></div> 
</div> 
<div class='myparent'> 
    <div class='mychild'></div> 
</div> 

我觉得我真的很接近：

$('div.myparent:not(:has(div[class=locked]))') 

但是，这并不工作。

Answer 1

你可以使用类选择，没有必要对属性选择DEMO

$('.myparent:not(:has(div.locked))') 

注： - 你可以这样做太： - $('.myparent:not(:has(.locked))')

Answer 2

1. 子类，并使用不（ ）排除锁定类别，然后使用父级锁定父级

$(".mychild:not(.locked)").parent().css("color","red")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='myparent'> 
 
    <div class='mychild locked'>1</div> 
 
</div> 
 
<div class='myparent'> 
 
    <div class='mychild locked'>2</div> 
 
</div> 
 
<div class='myparent'> 
 
    <div class='mychild'>3</div> 
 
</div>

Answer 3

另一种选择是使用jquery filter到filter出myparent不具有locked孩子 - 看演示如下：

$('.myparent').filter(function(){ 
 
    return !$(this).find('.locked').length; 
 
}).css('color','blue');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='myparent'> 
 
    <div class='mychild locked'>one</div> 
 
</div> 
 
<div class='myparent'> 
 
    <div class='mychild locked'>two</div> 
 
</div> 
 
<div class='myparent'> 
 
    <div class='mychild'>three</div> 
 
</div>