如何爲給定的附圖設置交替行顏色

Question

描述：在下圖中，表格由具有展開窗口的行組成。展開視圖的詳細信息也是連續的。所以，一條記錄保存在兩行中。主表和另一行中的一行在擴展。所以，在這裏，我們需要爲主表應用備用行顏色，而不是展開行。我們如何爲主要行應用交替行顏色。對於MVC

Answer 1

的jQuery（JavaScript）的方法

發送CSS類 - 最佳兼容性。

在下面的例子中，第一個nth-child過濾器從第一個開始選擇每第四個項目。然後它會從第三個開始過濾每個第四個項目。這幾乎適用於每個瀏覽器。

jQuery(document).ready(function(){ 

    $('tr') 
     .filter(':nth-child(4n+1)').addClass("rowColor1") 
    .end() 
     .filter(':nth-child(4n+3)').addClass("rowColor2"); 

}); 

DEMO -​​

純CSS方法 - 最佳的速度和純度。

更簡單的方法是使用CSS。這將是最快的方法，並且意味着您沒有不必要的腳本運行。它可能不適用於舊版瀏覽器，但請檢查瀏覽器統計信息以獲取用戶的人口統計信息。

tr:nth-child(4n+1) { 
     background: rgba(255,0,0,1); 
} 
tr:nth-child(4n+3) { 
     background: rgba(255,0,0,0.5); 
} 

DEMO -

http://jsfiddle.net/f3hk8/1/

Answer 2

  $('table tr:nthchild(even)').css("background","red"); 
     $('table tr:nthchild(odd)').css("background","white");