jQuery 将编号类递归添加到 div block

标签 jquery html class add

我动态地包装了数组中固定数量的 div(例如,每组 4 个)。 从数组返回的 .item div 的数量未知... 我需要递归地将相同的类添加到包装在一起的那些 div 组中:

<div class="wrapper">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<div class="wrapper">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<!-- more divs follow... -->
<div class="wrapper">
   ...
</div>
<div class="wrapper">
   ...
</div>

这是最终结果:

<div class="wrapper">
  <div class="item div-01"></div>
  <div class="item div-02"></div>
  <div class="item div-03"></div>
  <div class="item div-04"></div>
</div>
<div class="wrapper">
  <div class="item div-01"></div>
  <div class="item div-02"></div>
  <div class="item div-03"></div>
  <div class="item div-04"></div>
</div>
<!-- more divs follow... -->
<div class="wrapper">
   ...
</div>
<div class="wrapper">
   ...
</div>

我用来包装 div 的代码:

var divs = $(".item");
for(var i = 0; i < divs.length; i+=4) {
    divs.slice(i, i+4).wrapAll('<div class="wrapper"></div>');
}

最佳答案

$('.wrapper').each(function() {
    $.each($(this).children('.item'), function(k,v) { // k = index, v = value
        $(this).addClass('div-' + (k < 9 ? '0' : '') + (k+1));
    });
});

使用 each() 遍历项目并使用索引添加类。

关于jQuery 将编号类递归添加到 div block ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31115973/

相关文章:

javascript - AJAX:我如何绑定(bind) KeyUp 上的自动完成功能才能使用键盘键

javascript - YouTube 播放器 API 和 jQuery slider

javascript - Html Javascript网站在移动设备上删除水平滚动

jquery - 间隔滑动 div - jQuery

css - 如何将页脚粘贴到底部并将侧边栏和内容 div 拉伸(stretch)到页脚?

java - 如何使用调用该方法的类的名称创建一个新的 .txt 文件?

javascript - 长下拉菜单在悬停时拉背景

javascript - 高级 jQuery 粘性侧边栏

c++ - 如何创建和使用类箭头运算符?

java - 使用类参数来分配字段值