检查每个元素是否包含另一个特定元素

Question

我有以下内容：

<div class="main">
   <div class="sub"></div>
</div>

<div class="main">
   <div class="sub"></div>
</div>

<div class="main">
   <div class="another"></div> <!-- Attention: This div does not have .sub -->
</div>

<div class="main">
   <div class="sub"></div>
</div>

如何检查是否存在一个不包含div.sub的div.main？

我的代码似乎只检查第一个div.main

if ($('.main .sub')[0]) {
    console.log('All div.main contain div.sub');
}
else {
    console.log('Some div.main which does not contain div.sub');
}

Answer 1

你可以

if($('.main:not(:has(.sub))').length == 0){
    console.log('all contains sub')
}

演示：Fiddle

Answer 2

$('.main').each(function() {
    if ($(this).children('.sub').length > 0) {
         console.log("yes");
    } else {
         console.log("no");
    }
});