如何根據使用jQuery

Question

我有這個標記元素的數量分配特定的類作爲

<div id="one" class="content"> 
    <a href="#">a</a> 
    <a href="#">b</a> 
    <a href="#">c</a> 
</div> 
<div id="two" class="content"> 
    <a href="#">d</a> 
    <a href="#">e/a> 
</div> 
<div id="three" class="content"> 
    <a href="#">f</a> 
</div> 

是否有其根據a元素的每個div.content數，我可以指定一個不同的方式類到div.content元素。

例如，在div#one，我有3 a元素，所以我會做$('div#one').addClass('three-img');在div#two，我有2 a元素，所以我會做$('div#two').addClass('two-img')，而在div#three，我只有1 a元素，所以我會做$('div#three').addClass('one-img')。

以下jQuery代碼僅適用於div#one。我要的是，這將在頁面中應用到每一個div.content通用代碼（有可能是具有div.content元素1或2或裏面3種a元素的數目不詳。

if($('#one a').length == 3){ 
    $('#one a').parent().addClass('three-img'); 
} else if($('#one a').length == 2){ 
    $('#one a').parent().addClass('two-img'); 
} else if($('#one a').length == 1){ 
    $('#one a').parent().addClass('one-img'); 
} 

Answer 1

我會去這樣的事情：

var classes = { 1: 'one-img', 2: 'two-img', 3: 'three-img' }; 

$('div.content').each(function() { 
    var content = $(this); 
    content.addClass(classes[content.children().length]); 
}); 

檢查test here

Answer 2

$('.content').each(function(i){ 
    $(this).addClass(i + 'img'); 
}); 

喜歡的東西？那

Answer 3

我會做這種方式：

$(".content").each(function() { 
    $(this).addClass("img_" + $(this).find("a").length); 
}); 

那假設你的類被命名爲img_1 ，img_2等

Answer 4

這會有幫助嗎？可以遍歷所有類內容div和獲得當前div的兒童

$(document).ready(function(){ 
     $("div.content").each(function(e){ 
      var numberofchildren = $(this).find("a").length; 
      if(numberofchildren == 3){ 
       $(this).addClass("three-img") 
      } 
      else if(numberofchildren == 2){ 
       $(this).addClass("two-img") 
      } 
      else { 
       $(this).addClass("one-img")  
      } 
     }); 
    }); 

或者，您可以動態添加類，如下

$(document).ready(function(){ 
     $("div.content").each(function(e){ 
      var numberofchildren = $(this).find("a").length; 
      $(this).addClass("img-" + numberofchildren); 

     }); 
    }); 

Answer 5

var numbtxt = ['one', 'two', 'three']; 

$('.content').each(function(){ 
    $(this).addClass(numbtxt[$('a', this).length-1]+'-img'); 
});