的股利和添加類檢查列表項，如果沒有內容

Question

我有一個清單，2項 - 一個有一個形象，一個沒有

<ul class="listings news"> 
    <li> 
     <div class="image"> 
      <a href="/"><img src="images/temp/inner1.jpg" alt=""></a> 
     </div> 
     <div class="content"> 
      <h3><a href="/">Sub-section title link</a></h3> 
      <p>Text content</p> 
     </div> 
    </li> 
    <li> 
     <div class="content"> 
      <h3><a href="/">Sub-section title link</a></h3> 
      <p>Text content</p> 
     </div> 
    </li> 
</ul> 

我想找到它沒有形象的一個，並添加類要麼LI或「內容」 DIV - 迄今爲止發現它，但增加了全班所有LI的DIV，而不是僅僅指剛在一個沒有圖像：

if ($(".news li").find(".image").length > 0){ 
    $(".content").addClass("no-thumb"); 
} 

試過很多的變化，採用了「有'功能等，但沒有喜悅 - 任何幫助讚賞

乾杯 .ben。

Answer 1

嘗試：

$(function() { 
    $(".news li").each(function() { 
     $(this).find('.image').parent().addClass("no-thumb"); 
    }); 
}); 

Jsfiddle

問題是$(".news li")返回所有li從消息容器（所以$(".news li").find(".image").length > 0總是false如果有至少一個），但你想通過每一個人迭代項目。

另外您應該知道，$(".content").addClass("no-thumb");將類別設置爲每元素與content類別。

Answer 2

可以遍歷所有li孩子的元素具有類新聞並檢查它是否沒有與類圖像子元素類添加無拇指其子元素具有類內容

你可以這樣說：

$(".news li").each(function() { 
 
    
 
    if ($(this).find(".image").length == 0) { // check if div with class image not exists 
 
     $(this).find(".content").addClass("no-thumb"); // add class to content div 
 
    } 
 

 
});

.no-thumb { 
 
    background-color:red; 
 
    
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
 
<ul class="listings news"> 
 
    <li> 
 
     <div class="image"> <a href="/"><img src="images/temp/inner1.jpg" alt=""></a> 
 

 
     </div> 
 
     <div class="content"> 
 
      <h3><a href="/">Sub-section title link</a></h3> 
 

 
      <p>Text content</p> 
 
     </div> 
 
    </li> 
 
    <li> 
 
     <div class="content"> 
 
      <h3><a href="/">Sub-section title link</a></h3> 
 

 
      <p>Text content</p> 
 
     </div> 
 
    </li> 
 
</ul>

Answer 3

避免顯式循環的另一種解決方案是使用jQuery：has選擇器。

$(".news li:not(:has(.image))").find('.content').addClass("no-thumb"); 

Link to jsFiddle

Answer 4

$(".news li").each(function(){ 
    if($(this).find(".image").length < 1){ 
     $(".content",this).addClass("no-thumb"); 
    } 
}); 

fiddle

Answer 5

您可以使用下面的代碼來獲取所有不包含.image元素和no-thumb類添加到li元素li元素。

$("li").not($("li").has(".image")).addClass("no-thumb")

編輯：這裏是一個小提琴在行動證明了該代碼：

http://jsfiddle.net/jwnace/ryqyr2p3/