獲取沒有一個孩子有某一類的所有父母

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>