jquery - jQuery 定位元素的每个第 n 个兄弟元素

Question

我有以下标记：

<div class="region">
<div class="award">
<div class="award">
<div class="region">
<div class="award">
<div class="award">
<div class="award">
<div class="award">
<div class="award">
<div class="award">

如何定位 .region 之后的第三个元素，以便得到类似的东西？

<div class="region">
<div class="award">
<div class="award">
<div class="region">
<div class="award">
<div class="award">
<div class="award third">
<div class="award">
<div class="award">
<div class="award third">

请注意，它不计算第一个 .region 之后的前两个 .award 元素。

提前致谢！

Answer 1

nextUntil结合eq应该这样做：

$("div.region").each(function() {
    $(this).nextUntil(":not(.award)").eq(2).addClass("third");
});

不，比这更复杂一点，处理第 6 个元素：

$("div.region").each(function() {
    $(this).nextUntil(":not(.award)").filter(function(index) {
        return index % 3 == 2;
    }).addClass("third");
});

实例| 来源

在那里，我们抓取每个.region元素，让它们的兄弟姐妹直到第一个不是.award( nextUntil) 的元素，以及filter不是每隔三个的元素。

（不知道为什么我map在我的第一个工作副本中使用，filter这更有意义。）