HTML中的交替背景顏色UL

我想使用JQuery替換HTML無序列表中的背景顏色而不使用。HTML中的交替背景顏色UL

2011-02-23 HTweaks

你嘗試過這麼遠嗎？爲什麼使用JavaScript？如果您動態生成列表，則無需JavaScript即可輕鬆完成此操作。 –

我只是想動態使用JavaScript來做到這一點！ – HTweaks

請問你的問題有一點點細節我想你的'點' –

最好的辦法是CSS3 :nth-child選擇：

#myul li:nth-child(odd) { 
    background-color: red; 
} 
#myul li:nth-child(even) { 
    background-color: green; 
}

，或者如果由於某種原因，你真的需要JavaScript的解決方案：

<style> 
    li.even { background-color: red; } 
    li.odd { background-color: blue; } 
</style> 

var ul = document.getElementById('myul'); 
var items = ul.getElementsByTagName('li'); 
for (var i = 0; i < items.length; i++) { 
    var class = i % 2 == 0 ? 'even' : 'odd'; 
    items[i].className = class; 
}

或已經提到的，你可以只生成類服務器端。

來源

2011-02-23 11:54:48 roryf

<style> 
.uneven{background-color:red;} 
.even{background-color:green;} 
</style> 
<ul> 
<li class="uneven">A</li> 
<li class="even">B</li> 
<li class="uneven">C</li> 
<li class="even">D</li> 
</ul>

可能缺少點..

來源

2011-02-23 11:47:25

我只是說動態的JavaScript！ – HTweaks

那麼你爲什麼要標記'css'？ – kapa

因爲我必須使用CSS使用JavaScript：foo.style.backgroundColor =「#cccccc」; – HTweaks

你可以只用CSS做： http://www.w3.org/TR/css3-selectors/#nth-child-pseudo

這不會在IE工作，雖然。

來源

2011-02-23 11:53:47 Flo

不完全是真的它已經在IE9 Beta中運行。 – kapa

這裏是你如何做到這一點的所有UL的頁面沒有任何CSS - http://jsfiddle.net/2G7wx/1/