jQuery each: 分别运行每一个 li 集合答案

【问题标题】：jQuery each: run through each set of a li individuallyjQuery each: 分别运行每一个 li 集合
【发布时间】：2012-11-27 06:20:53
【问题描述】：

我什至不知道如何解释我的问题 - 这就是奇怪的标题的来源。我有一个 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 循环贯穿了一个 ALL <li>s。我想知道如何单独运行每个li:year li。听起来很奇怪吧？

所以我实际上想单独循环遍历每个 li.year，以便我的 i 计数总是在每个 li.year 中重新开始

【问题讨论】：

标签： javascript jquery loops each

【解决方案1】：

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

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

【讨论】：

【解决方案2】：

这是你的意思吗？

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

【讨论】：

【解决方案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 相关的索引。

【讨论】：