jQuery each：分别遍历每一组li

Question

我甚至不知道如何解释我的问题 - 这就是奇怪的标题来自哪里。 我有一个ul包裹另一个ul，就像下面的示例一样。

<ul class="event-items">
   <li class="year 2012"></li>
   <li class="year 2011"></li>
   <li class="year 2010">
      <ul>
         <li></li>
         <li></li>
         <li></li>
      </ul>
   </li>
<li class="year 2010"></li>
…

因此，每个li.year都有另一个<ul>，里面有多个孩子。

现在我的问题：

我想知道如何逐个完成each li.year。

现在我正在这样做......

$('ul.event-items li.year ul li').each(function(i) {
    if ( i % 4 == 0 ) $(this).addClass('clearLeft');
});

但是这个each循环遍历所有<li>。我想知道如何逐个完成每个li:year li。听起来很奇怪吧？

所以我实际上想要单独循环遍历每个li.year，以便我的i计数始终在每个li.year内开始新鲜

Answer 1

使用嵌套循环分别迭代每个内部ul的子项：

$('ul.event-items li.year ul').each(function() {
    $("li", this).each(function(i) {
        if (i % 4 == 0) 
            $(this).addClass('clearLeft');
    });
});

Answer 2

这是你的意思吗？

$('ul.event-items li.year').each(function(i) {
    if ( i % 4 == 0 ) $(this).find('ul li').addClass('clearLeft');
});

Answer 3

或者，您也可以使用.index()。

$('ul.event-items li.year ul li').each(function() {
  var $this = $(this);
  if ( $this.index() % 4 == 0 ) $this.addClass('clearLeft');
});

.index()会返回与其父li相关的每个ul的索引。