一個更好的辦法來確定偶/表

奇數行假設你有下面的示例代碼網頁：一個更好的辦法來確定偶/表

<tr class="even"> 
    <td>something1</td> 
    <td colspan="1">somthing1.1</td> 
</tr> 


<tr class="odd"> 
    <td>something2</td> 
    <td><b>something2.1</b></td> 
</tr> 

<tr class="even"> 
    <td>something3</td> 
    <td><b>something3.1</b></td> 
</tr>

這些都不是在一個循環中，所以我必須明確地說「甚至」「奇」。稍後，如果我們決定在something2和something3之間添加一個新行，那麼我們需要爲其餘行更改'even''odd'。

是否有辦法在CSS中自動在IE6中做到這一點？

目前，這是我的CSS代碼甚至

.headerTable tr.even { 
    font-weight : bold; 
    font-size : 9pt; 
    font-family : Arial,Helvetica,sans-serif,Verdana,Geneva; 
    background-color: #FFFFFF; 
    height: 20px; 
    color: #000000; 
}

我已經有jQuery的

來源

2009-06-01 n00bstackie

@OP，請注意將來格式化和拼寫問題。 – 2009-06-01 18:31:34

@OP - 你說「這些不在一個循環中」 - 數據是從哪裏來的 - 你是用手輸入HTML的嗎？ – 2009-06-01 18:37:38

@Rob：我想這就是他的意思。對我有意義... – 2009-06-01 20:23:23

給jQuery一個嘗試。然後，你可以簡單地這樣做：

$("#myTable tbody tr:visible:even",this).addClass("even"); 
    $("#myTable tbody tr:visible:odd",this).addClass("odd");

的「：可見」選擇是不是真的有必要，但是當你通過做一些隱藏的行篩選表，該方法將仍然正常工作。

來源

2009-06-01 18:28:09

使用jQuery的奇/偶子implementation

來源

2009-06-01 18:25:40 Mork0075

是。您可以使用JavaScript來運行這些元素，並根據偶數/偶數重新設置類。

來源

2009-06-01 18:27:02

最好的辦法是:nth-child() pseudo-class。

但不幸的是，它尚未得到廣泛支持。所以你可能需要使用JavaScript來做到這一點。

來源

2009-06-01 18:29:14 Gumbo

做到這一點的方法是使用第n個孩子（偶數）和（奇數）規則。不幸的是，這應該不令人意外，IE6不支持這一點。所以，你有幾種選擇：

A）使用JavaScript，與它的明顯的缺點不工作的人與JS禁用：

var rows = document.getElementById('mytable').getElementsByTagName('tr'); 
for(var x = 0; x < rows.length; x++) { 
    rows[x].className = (x % 2 == 0) ? 'even' : 'odd'; 
}

如果您希望在需要在你的應用更加動態的客戶端行爲，那麼你可以檢查一個類似jQuery的庫。對於只是這個這是沒有必要的，但它使瀏覽器上的JavaScript工作變得輕而易舉。你會用jQuery來完成上述工作，就像它在這個答案中所顯示的那樣。

根據您的觀衆，Javascript可能是完全可以接受的。如果不是，那麼也許你可以...

B）簡化你的CSS，並繼續手動。您只能用一個類標記奇數行，然後使行默認樣式爲均勻樣式。當移動東西時，這將爲您節省一些工作。

C）以編程方式生成行。如果要將數據更新到固定的表格中，這會非常古老，因爲這是一個問題。我明顯沒有意識到你的情況，但是用一個簡單的語言如PHP來循環執行此操作應該是微不足道的。 D）停止使用真正過時的瀏覽器。 :)（這只是半開玩笑，因爲我確信它超出了你的控制範圍）

來源

2009-06-01 18:29:28

一個更好的辦法來確定偶/表

回答

相關問題