JQuery的：第n個孩子（）追加

Question

我有簡單的列表：

<ul> 
<li>some text 1 </li> 
<li>some text 2</li> 
<li>some text 3</li> 
<li>some text 4</li> 
<li>some text 5</li> 
<li>some text 6</li> 
<li>some text 7</li> 
</ul> 

我需要每個4N元素後添加一些DIV

我：

$("ul li:nth-child(4n)").after("<div style='color:black'>test</div>"); 

但是比如我有4個元素和我的div之後，並且比我只有3個元素，但我需要在第三個元素後追加我的div ...如何做到這一點？ 謝謝！

Answer 1

你可以使用.add()添加到jQuery的結果集的最後li，如果它不被nth-child規則匹配..

$("ul li:nth-child(4n)") 
    .add('ul li:last') 
    .after("<div style='color:black'>test</div>"); 

演示在http://jsfiddle.net/gaby/a8vAU/

Answer 2

你還可以依靠grep來做採摘：

var $lis = $('li'); 

$lis = $($.grep($lis, function (l, i) {return (i+1)%4 == 0 || i == $lis.length - 1;})); 

$lis.after("<div style='color:black'>test</div>");