javascript - 使用 jquery 为每 7 个元素添加不同的类

标签 javascript jquery html

我正在创建一个包含帖子列表的博客页面。每篇博文都有相同的 html,例如:

<article class="post">
  post 1
</article>

我想给每 7 篇文章一个类序列('medium','small','large','large','small','small','medium')

<article class="post medium">
  post 1
</article>
<article class="post small">
  post 2
</article>
<article class="post large">
  post 3
</article>
<article class="post large">
  post 4
</article>

当我发布第 8 篇博客时,一切都从头开始。这可能吗?

任何指向正确方向的点都将非常受欢迎!

最佳答案

您可以使用 addClass 并检查其索引:

var classNames = ['medium','small','large','large','small','small','medium'];

$('article.post').addClass(function(i){
    return classNames[ i % classNames.length ];
});

演示:http://jsfiddle.net/wgdv4/

关于javascript - 使用 jquery 为每 7 个元素添加不同的类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13458598/

相关文章:

javascript - 更新 div 内的计时器。 JavaScript

javascript - Firefox 和 Google Chrome 中 location.reload() 的不同行为

javascript - 应用 z-index 时悬停状态不起作用

javascript - 如何: two divs floating left one static and the other responsive

javascript - 选择下拉菜单后,使用 Javascript 和 AJAX 禁用特定文本字段

javascript - 我收到未定义的 xml 对象。为什么?

javascript - jquery ajax 到 php 脚本不保存数据

javascript - 右键单击守夜人

javascript - 曾经正常工作的网站突然抛出 jquery "uncaught syntaxErrors"

javascript - $ ("#myTextArea").val() 返回空字符串