Javascript 在某个div之后重新应用奇偶样式 我正在做一个新闻页面。每个月的最新帖子都有大帖子，每个奇数/偶数的小帖子都有不同的样式，使用jQuery只按类进行选择（大帖子是“.blogPostBig”，小帖子只是“.blogPost”）：

以下是它应该如何工作：

但是，如果在下一个大帖子之前只有一个小帖子，您可以在下面的示例中看到，那么使用奇数和偶数的样式将被弄乱：

我已经研究过使用.after（），.prev（），.next（），但它们似乎不能帮助我实现我想要的

我想知道的是，如果有一种方法可以重置/应用小帖子的奇数/偶数样式，在大帖子之后，在每个大帖子之后

提前谢谢

****编辑****

布局如下：

- big
- small
- small
- small
- big
- small

-大的
-小的
-小的
-加载更多

变成

-大的
-小的
-小的
-大的
-小的
-小的
-小的
-大的
-荷德莫尔

---

等等。

假设所有

.blogPost

/

.blogPostBig

元素都是兄弟元素，如下所示：

- big
- small
- small
- small
- big
- small

您应该能够在迭代每个元素时使用：

$('.blogPostBig').each(function(){
  smallPosts = $(this).next()   // start with the first small post after this big post
    .nextUntil('.blogPostBig')  // stop when we hit another big post
    .andSelf();                 // add back the first small post
  smallPosts.filter(':odd').css({color: 'red'})
  smallPosts.filter(':even').css({color: 'blue'})
});

这有点混乱，但我不确定是否有唯一的选择方法（但我可能错了）

---

供您查看。

这正是我想要的！我想我没有提到的一件事是，我有一个“加载更多帖子”（“.loadMore”）div，它似乎破坏了这一点。我将更新主帖子，以显示布局的含义。好的，我几乎解决了我的问题。loadMore的功能把它搞乱了，所以我只是让它在loadMore上重新运行，并使用它自己的代码，这就解决了它。剩下的就是“border right”样式仍然应用于loadMore div。完全修复了它：只需给出“border:0！”！对于loadMore div来说很重要！谢谢你的帮助。很高兴你把事情都解决了！如果你最终通过“加载更多”在页面上加载了大量帖子，我建议你尽量避免重新处理已经处理过的元素。但在项目的这个阶段，这可能是一个过早的优化。