如何获取当前元素的子元素？

Question

我有一个类似于以下结构的页面：

<div id="row_2">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

我如何得到row_2的第n个孩子，假设我不能使用该id（例如我在row_1，我正在转移到下一个）

我尝试了以下内容：

current.parent().next().children().filter(":nth-child("+i+")");

其中“current”是前一个“row div”上的项目，“i”是项目的索引，但这不起作用。我也尝试使用0代替“i”来测试它，但这也不起作用 - 哪里出错？

Answer 1

假设我已正确理解您的问题，您正在寻找eq，而不是nth-child：

current.parent().next().children().eq(i);

正如文档陈述eq：

  

将匹配元素集合减少到指定索引处的元素。

Answer 2

我不完全确定你在做什么，但我建议：

current.parent().next().find(":nth-child("+i+")");

或者：

current.parent().next().children().eq(i);

如果您需要使用filter()，我建议（虽然不知道到底发生了什么）可能会尝试：

current.parent().next().children().filter(
    function(){
        return $(this).is(":nth-child("+i+")");
    });

但我看不到优势，除非你想过滤其他标准。

参考文献：

• eq()。
• filter()。
• find()。

Answer 3

如果您的起点是row_1，那么：

var row2child3 = row1.next().children().eq(2); // zero-based index, 2 = third child

Live example | source

假设row_1和row_2紧邻，例如：

<div id="row_1">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<div id="row_2">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

如果没有，您可能需要.nextAll("some selector here").first()而不是.next()。

如果您的起点是row_1中的项之一，那么：

..在其中插入parent()：

var row2child3 = item.parent().next().children().eq(2); // zero-based index, 2 = third child

Live example | source