jQuery :odd or :even to addClass up to a certain selector?

Question

我需要向选择器添加一个替代类(奇数或偶数)，然后在到达另一个选择器后重新开始。

我有什么

<div class="person"></div>
<div class="person"></div>
<div class="person"></div>
<div class="person"></div>
<div class="person"></div>
<div class="section-separator"></div>
<div class="person"></div>
<div class="person"></div>

我需要什么

<div class="person"></div>
<div class="person alt"></div>
<div class="person"></div>
<div class="person alt"></div>
<div class="person"></div>
<div class="section-separator"></div>
<div class="person"></div>
<div class="person alt"></div>

我遇到的问题是它想要继续计算上一节的奇数/偶数而不是重新开始，所以我的样式无法正确应用。我当前的 jQuery 是 $('.personbox:odd').addClass('alt');

Answer 1

我不认为有什么聪明的方法可以做到这一点。不聪明的方法是选择 .person 和 .section-separator 元素并循环，跟踪索引:

var index = 0;
$(".person, .section-separator").each(function() {
  var $this = $(this);
  if ($this.hasClass("section-separator")) {
    index = 0;
  } else {
    if (index % 2 == 1) {
      $this.addClass("alt");
    }
    ++index;
  }
});

.alt {
  color: blue;
}

<div class="person">testing</div>
<div class="person">testing</div>
<div class="person">testing</div>
<div class="person">testing</div>
<div class="person">testing</div>
<div class="section-separator">separator</div>
<div class="person">testing</div>
<div class="person">testing</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>