jquery - div的条纹类

Question

我有一长串多个 div ......比如说 20 个 div

全部包裹在另一个..

<div id="main">
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
 <div class="xyz"> text text </div>
.... etc
</div>

我喜欢在二分之一的 div 中添加“灰色”类并使其成为斑马！请jquery！

Answer 1

$('.xyz:odd').addClass('grey');

请注意“灰色”不是语义类名。最好叫 id 'odd' 或 'zebra' 什么的。如果您下定决心将奇怪的颜色更改为蓝色，那么您的班级名称将非常奇怪：P

Answer 2

jQuery 让它变得尽可能简单：

$('#main>div.xyz:even').addClass('grey');

http://api.jquery.com/even-selector/

Answer 3

如果你不关心旧版本的 IE，你可以单独使用 CSS 来做到这一点：

.xyz:nth-child(odd) {
  background-color: ...;
}

.xyz:nth-child(even) {
  background-color: ...;
}