更改每2行而不是每个表行

时间:2011-01-11 06:55:42

标签: javascript mootools

我有这个代码,用于将每一行的类从奇数更改为偶数。我想要它做的甚至是奇怪的甚至奇怪甚至奇怪的事情:

window.addEvent('domready', function() {

var count = 0;

$$('table.pretty-table tr').each(function(el) {

el.addClass(count++ % 2 == 0 ? 'odd' : 'even');

});

});

4 个答案:

答案 0 :(得分:5)

el.addClass(count++ % 4 > 1 ? 'odd' : 'even');

答案 1 :(得分:2)

你可以使用光滑的。

$$("table.pretty-table tr:nth-child(4n), table.pretty-table tr:nth-child(4n-1)").addClass("even");

简单。 http://www.w3.org/TR/css3-selectors/#structural-pseudos

行动中:http://www.jsfiddle.net/dimitar/mdtVB/5/

顺便说一下,它让我想知道使用光滑是否比.each循环更快,所以我做了一个小测试器类:

http://www.jsfiddle.net/dimitar/mdtVB/6/

光滑运行首先进行10000次迭代,然后运行10秒,它也运行.each。在Windows框中的FF 3.6.12中,光滑赢了但是很少。通过#id调用表格也会有利于Slick - http://www.jsfiddle.net/dimitar/mdtVB/8/(在测试开始运行jsfiddle之前延迟2秒)。

答案 2 :(得分:1)

也不需要var计数

window.addEvent('domready', function() {
    $$('table.pretty-table tr').each(function(el, idx) {
        el.addClass(idx % 4 > 1 ? 'odd' : 'even');
    });
});
P.S:只是优化了Scrum Meister的答案。

答案 3 :(得分:0)

window.addEvent('domready', function() {

    var count = 0;

    $$('table.pretty-table tr').each(function(el) {
        if ( count == 0 || count % 4 < 2) {
            el.addClass( 'odd' );
        }
        else
        {
            el.addClass( 'even' );
        }
    });
    count++;
});