Question

我有一个函数检查img标签是否在一个带有＆＃34; colorbox＆＃34;类的图形元素内，如果是，则为某些元素添加一些额外的样式。但是，即使彩盒图中没有图像，该功能仍会运行，我不知道原因。

我的jQuery看起来像这样

jQuery(document).ready(function($){
  if ($(".colorbox").has("img")) {
     ~code here~
  }
}

这是彩盒图，显然没有img元素......

<figure class="colorbox">
  <ficaption>
    <h2></h2>
    <p></p>
    <p></p>
  </figcaption>
</figure>

那么为什么jQuery会选择一个不存在的元素？

Answer 1

我更喜欢find功能

var $img = $(".colorbox").find("img");

if ($img.length) { //exisst

}

Answer 2

我会这样做：

jQuery(document).ready(function($){
  $('.colorbox img').each(function(){
      var imageElement = $(this);
      // do whatever you want with this element !
  });
  // OR this way
  $('.colorbox').each(function(){
      var box = $(this);
      if( box.find('img').length ){
          // this means the parent colorBox has at least 1 img-Element 
      }

  });
}

现在问题：

$(".colorbox").has("images");

$(".colorbox")会返回列表元素（如果有）

然后你问列表是否.has("img")？这意味着如果列表中的一个元素内部有 img 元素，那么由于 if-statement ，您会得到 true ，这这就是你的代码没有按预期工作的原因

Answer 3

返回一个新的jquery子集。您需要if($(".colorbox").has("img").length)检查其中是否有任何img标记

jQuery检测不存在的元素

3 个答案: