Выберите элементы, которые не являются дочерними для определенного выбора

Question

Мне нужно выбрать все гиперссылки внутри div, которые не являются дочерними элементами div с классом «тест». Я думал, что $("a", $("div").not(".test")) будет работать, но если я поместил еще один div внутри div с классом «test», мой выбор не будет работать. В следующем примере я должен выбрать только ссылки 4, 5 и 6, что мне нужно для выполнения этой задачи?

var links = document.getElementsByTagName("a"); 
 
var notAds = $("a", $("div").not(".test")); 
 
console.log(links.length); 
 
console.log(notAds.length);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="test"> 
 
    <div> 
 
    <div> 
 
     <a href="test1.html">test 1 link</a> 
 
     <a href="test2.html">test 2 link</a> 
 
     <a href="test3.html">test 3 link</a> 
 
    </div> 
 
    </div> 
 
</div> 
 
<div> 
 
    <a href="test4.html">test 4 link</a> 
 
    <a href="test5.html">test 5 link</a> 
 
    <a href="test6.html">test 6 link</a> 
 
</div>

Answer 1

Вы должны использовать not метод для того, чтобы найти элементы, которые не имеют в качестве родителя div с test класса.

var notAds = $("a").not($('.test').find('a')); 

not метод удаления элементов из набора соответствующих элементов.

var links = document.getElementsByTagName("a"); 
 
var notAds = $("a").not($('.test').find('a')); 
 
console.log("Length: " + notAds.length); 
 
$(notAds).map(function(){ 
 
    console.log($(this).text()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="test"> 
 
    <div> 
 
    <div> 
 
     <a href="test1.html">test 1 link</a> 
 
     <a href="test2.html">test 2 link</a> 
 
     <a href="test3.html">test 3 link</a> 
 
    </div> 
 
    </div> 
 
</div> 
 
<div> 
 
    <a href="test4.html">test 4 link</a> 
 
    <a href="test5.html">test 5 link</a> 
 
    <a href="test6.html">test 6 link</a> 
 
</div>