jQuery выбирает изображение в div, если у родительского изображения нет определенного класса

Question

Wordpress оборачивает изображения с подписями в div с классом .wp-caption. Я ищу способ выбрать изображения, которые не имеют этого div, чтобы я мог обернуть их в другой div. (чтобы сохранить согласованную границу вокруг всех изображений)

<div class="blog-post-content"> 
 <div id="attachment_220" class="wp-caption alignleft" style="width: 310px">
  <a href="/somewhere/"><img class="size-medium wp-image-220" src="/path/to/image" alt="" width="300" height="280" /></a>
  <p class="wp-caption-text">Caption Text</p>
 </div>
 <p>This is the body of the post</p>
</div>

Чтобы проверить мой селектор, я просто пытаюсь добавить зеленую рамку. Я могу обработать .wrap (), когда селектор работает.

Самая многообещающая из моих попыток:

$('.blog-post-content img').parent('div:not(".wp-caption")').css('border', '2px solid green');

... но не повезло.

Answer 1

Как насчет этого: (не проверено)

$('.blog-post-content img').filter(function(){
    return !$(this).parents('div').hasClass('wp-caption');
}).css('border', '2px solid green');

Answer 2

Я знаю, что этот вопрос задавался очень давно, но я хотел бы предложить следующее:

$('.blog-post-content img').closest('div:not(".wp-caption")')

Не проверено, но я думаю, что это должно работать, и короче, чем ответ выше, который работает. Использование ближайшего означает, что a игнорируется.

Answer 3

попробовать:

$('.blog-post-content img').parent(':not("div.wp-caption")')

Нет, если то, что Матти говорит об элементе a в иерархии, то вышеприведенное не будет работать.