添加第n個孩子類dynamicaly

需要（通過jQuery的）添加第n個孩子類dynamicaly

<ul> 
    <li class="green">Green</li> 
    <li class="red">red</li> 
    <li class="black">black</li> 

    <li class="">Green</li> 
    <li class="">red</li> 
    <li class="">black</li> 

    <li class="">Green</li> 
    <li class="">red</li> 
    <li class="">black</li> 

</ul>

我的代碼

jQuery('ul').each(function(){ 
       jQuery(this).find('li:nth-child(1n)').addClass('green'); 
       jQuery(this).find('li:nth-child(2n)').addClass('red'); 
       jQuery(this).find('li:nth-child(3n)').addClass('black'); 
    });

我添加靜態類上第一行動態添加類（指第3華里），極品相同的多行作爲第一行你可以使用jQuery的在這裏演示 http://jsfiddle.net/WfKeY/

來源

2013-01-01 ShibinRagh

心靈解釋爲什麼不會告發你是否親手添加它們？ – Alexander

[你有什麼嘗試？]（http://whathaveyoutried.com/） –

我試過了，我會加我的代碼 – ShibinRagh

你應該重複每3個要素類，所以用3n，3n+/-1，3n+/-2：

jQuery('ul').each(function(){ 
    jQuery(this).find('li:nth-child(3n-2)').addClass('green'); 
    jQuery(this).find('li:nth-child(3n-1)').addClass('red'); 
    jQuery(this).find('li:nth-child(3n)').addClass('black'); 
});

更新演示：http://jsfiddle.net/WfKeY/2/

來源

2013-01-01 21:07:56

有趣非常感謝你...，偉大的工作 – ShibinRagh

現在我明白的問題，這裏是一個一個lternative：

var $li = $('ul > li'); 
$li.each(function(i) { 
    $(this).addClass($li.eq(i%3).attr('class')); 
});

http://jsfiddle.net/zaMUU/5/

來源

2013-01-01 20:59:43 Levi

對不起，注意克隆，我需要正確添加類名稱 – ShibinRagh

你的意思是你想讓類名等於文本？ – Levi

是更新了我的代碼 – ShibinRagh

添加第n個孩子類dynamicaly

回答

相關問題