將css應用到動態創建的奇數/偶數行

我有幾個動態創建的表。行可以高達1000+。創建行之後，我運行下面的代碼：將css應用到動態創建的奇數/偶數行

$('[id$=TestGrid]').not('tr:first').each(function() { 
    $('tr:odd', this).addClass('odd').removeClass('even'); 
    $('tr:even', this).addClass('even').removeClass('odd'); 
});

或者我應該做

$('[id$=TestGrid]').not('tr:first').each(function() { 
    $('tr:nth-child(odd)', this).addClass('odd').removeClass('even'); 
    $('tr:nth-child(even)', this).addClass('even').removeClass('odd'); 
});

因爲，它是動態的，我不知道該ID的，但我不知道他們將結束與「... TestGrid」。

以上任何一種情況都會導致迴流問題？如果是這樣，我該如何解決這個問題？

謝謝！

來源

2014-04-26 alpha

你真正應該做的事情畫奇數/偶數行是使用CSS。 – dfsq

什麼是'[id $ = TestGrid]'？一張桌子還是一排桌子？ –

爲什麼在創作/創作過程中，你不會添加到你的創作中的單數甚至是上課？這比通過它運行jquery快1000倍，而且它也完全不需要。 – alpham8

您可以使用CSS :nth-child pseudo class樣式行：

/* odd rows plus skip first row */ 
tr[id$=TestGrid]:nth-child(2n + 3) { ... } 

/* even rows */ 
tr[id$=TestGrid]:nth-child(2n) { ... }

您還可以使用上述選擇的，是在jQuery代碼：

$('tr[id$=TestGrid]:nth-child(2n + 3)').addClass("odd").removeClass("even"); 
$('tr[id$=TestGrid]:nth-child(2n)').addClass("even").removeClass("odd");

的第n個孩子僞類是explained here。

來源

2014-04-26 19:45:12

你最好想使用CSS像這樣：

tr:nth-child(odd) { background: #f1f1f1; }

和/或

tr:nth-child(even) { background: #fff; }

來源

2014-04-26 20:09:23 JimmyRare

將css應用到動態創建的奇數/偶數行

回答

相關問題