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');

请注意'gray'不是语义类名。更好地称为'奇数'或'斑马'或其他东西。如果您下定决心并将奇怪的颜色更改为蓝色，那么您的类名将会非常奇怪：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: ...;
}