изменить каждые 2 строки вместо каждой строки таблицы - PullRequest
0 голосов
/ 11 января 2011

У меня есть этот код для изменения класса с нечетного на четный для каждой строки. То, что я хотел бы сделать, это пойти четное четное нечетное нечетное четное четное нечетное:

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

var count = 0;

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

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

});

});

Ответы [ 4 ]

5 голосов
/ 11 января 2011
el.addClass(count++ % 4 > 1 ? 'odd' : 'even');
2 голосов
/ 11 января 2011

вы можете использовать пятно.

$$("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/

между прочим, мне стало интересно, будет ли использование slick быстрее, чем цикл .each, поэтому я провел небольшой класс тестирования:

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

slick запускается сначала за 10000 итераций и через 10 секунд после загрузки, он также запускает .each. в FF 3.6.12 в окне Windows, гладкий выигрывает, но незначительно. вызов таблицы с помощью #id также будет иметь значение в пользу Slick - http://www.jsfiddle.net/dimitar/mdtVB/8/ (с добавленной задержкой в ​​2 секунды перед началом тестирования для правильного запуска jsfiddle).

1 голос
/ 11 января 2011

Нет необходимости в подсчете переменных также

window.addEvent('domready', function() {
    $$('table.pretty-table tr').each(function(el, idx) {
        el.addClass(idx % 4 > 1 ? 'odd' : 'even');
    });
});

P.S .: Просто оптимизирую ответ Scrum Meister.

0 голосов
/ 11 января 2011
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++;
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...