JQuery найти элементы, которые не имеют указанного предка

Question

Я должен найти некоторые элементы, которые не имеют указанного предка.Пример кода:

<a href="#">
  <img src="pic1.jpg" />
</a>
<p>
  <img src="pic2.jpg" />
</p>

Я хочу выбрать все теги img, не обернутые в тег a.

Как это сделать?

Answer 1

Можно также использовать родитель:

var images =  $('img').filter(function(){
  if(!$(this).parent().is('a')) {
    return $(this);  
  }
});

Answer 2

Вы можете сделать эту работу, используя более простое решение.

Используйте :not() вместо .filter( function ).

$("img:not(a img)").css("border", "3px solid red");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#">
  <img src="pic1.jpg" />
</a>
<p>
  <img src="pic2.jpg" />
</p>

Answer 3

Я сделал это с помощью этого кода:

$("img").filter(function(){
  return $(this).closest('a').length === 0
}).css("border", "3px solid red");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#">
  <img src="pic1.jpg" />
</a>
<p>
  <img src="pic2.jpg" />
</p>