Question

我有一张这样的表：

<table>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
    <tr><td>Test</td></tr>
</table>

我想在每两行之后添加一个CSS类alt，所以例如我将有一个包含2个白色行，2个红色行，2个白色行，2个红色行等的序列。这可以用JQuery吗？

Answer 1

http://jsbin.com/okahax/edit#javascript,html

var t = 0;
$("table tr").each(function (i, n)
{
    if (t < 2) 
    {$(this).css('background-color','red');

    }
    else if (t < 4)
    { 
        $(this).css('background-color','white');

    }
  t++;
  if (t==4) t=0;
})

Answer 2

这样的事情：

$('tr:nth-child(4n),tr:nth-child(4n-1)').addClass('alt');

这使用nth-child selector和适当的等式。

演示：http://jsfiddle.net/cnQNx/

或者：

$('tr:nth-child(4n)').prev().andSelf().addClass('alt');

每2行添加一个CSS类

2 个答案: