javascript - 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单独完成。

现在我正在这样做……</p>

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

但是，此each循环通过 ALL 运行<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.