将Class添加到每个第二个元素,从第一个元素开始计数

Sta*_*ter 4 html javascript css jquery html5

我有一个列表,我想在每个第二个元素中添加类,从第一个元素开始计算.

这是我的清单

<ul class="timeline">
  <span class="topbullet"></span>
  <li></li>
  <li></li>
  <div class="clearfix"></div>
  <li></li>
  <li></li>
  <div class="clearfix"></div>
  <li></li>
  <li></li>
  <div class="clearfix"></div>
  <li></li>
  <li></li>
  <div class="clearfix"></div>
  <li></li>
  <li></li>
  <div class="clearfix"></div>
</ul>
Run Code Online (Sandbox Code Playgroud)

我希望这样:

<ul class="timeline">
  <span class="topbullet"></span>
  <li class="odd"></li>
  <li class="even"></li>
  <div class="clearfix"></div>
  <li class="odd"></li>
  <li class="even"></li>
  <div class="clearfix"></div>
  <li class="odd"></li>
  <li class="even"></li>
  <div class="clearfix"></div>
  <li class="odd"></li>
  <li class="even"></li>
  <div class="clearfix"></div>
  <li class="odd"></li>
  <li class="even"></li>
  <div class="clearfix"></div>
</ul>
Run Code Online (Sandbox Code Playgroud)

这是我的jQuery代码

$(".timeline li:nth-of-type(2n)").addClass('even');
Run Code Online (Sandbox Code Playgroud)

添加'偶数'类没有问题,但是如何添加'奇数'类?我应该使用哪个选择器来计算第一个列表元素?

bip*_*tel 7

你可以像这样使用jquery的奇数和偶数选择器

$( ".timeline li:odd" ).addClass('odd');
$( ".timeline li:even" ).addClass('even');
Run Code Online (Sandbox Code Playgroud)

根据您的要求,您需要首先使用奇数,然后才能更改这个jquery

$( ".timeline li:odd" ).addClass('even');
$( ".timeline li:even" ).addClass('odd');
Run Code Online (Sandbox Code Playgroud)