jQuery表格樣式與CSS表格樣式的替代行

在服務器上生成的奇數/偶數行的表上使用CSS類或更好地使用CSS或使用jQuery在document.Ready()上使用樣式條紋？jQuery表格樣式與CSS表格樣式的替代行

我想開始使用jQuery來減少我的標記混亂，但我不確定性能，尤其是對於大型（最多200行）表。

2010-07-29 Caveatrob

根據瀏覽器，您可能沒有選擇。 jQuery將與像IE7這樣的老式瀏覽器一起工作，它們沒有第N個子選擇器。

理想情況下，你應該使用CSS。樣式表是要去的樣式的最佳位置。

我會用舊的瀏覽器的JavaScript備份使用CSS。如果，例如，你想斑馬所有表試試這個：

tr:nth-child(2n+1), tr.odd { background:#911100; } 
tr:nth-child(2n), tr.even { background:#222200; }

而jQuery中添加.odd和。即便類，如果瀏覽器是舊的。

//You will need to check which browsers don't support n-th child. But I doubt IE will  for example... 
if($.browser.msie && $.browser.version < 9) { 
    $('tr:odd').addClass('odd'); 
    $('tr:even').addClass('even'); 
}

來源

2010-07-29 03:11:42 Keyo

如果您在服務器端（例如PHP）生成表格行，您可以爲每行添加一個「偶數」或「奇數」類。這有利於在任何值得擔心的瀏覽器中工作，並且它的性能與您可以獲得的一樣（除了根本不使用CSS）。 – 2010-09-02 21:31:25

它不是100％（在Internet Explorer上），但我通常使用CSS nth-child。例如：

.someclass:nth-child(2n+1) { 
    background:#911100; 
}

會使隔行的background: #911100。整潔的事情是，即使你用jquery刪除一行，CSS自動重新記錄下面的行。

來源

2010-07-29 03:00:53

jQuery表格樣式與CSS表格樣式的替代行

回答

相關問題