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中的一个中添加“灰色”类，并将其制成斑马！请！

Answer 1

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

请介意“灰色”不是语义类名称。最好将ID“奇数”或“斑马”之类的东西称为。如果您下定决心并将奇怪的颜色更改为蓝色，那么您的className真的很奇怪：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: ...;
}