Is it possible to use nth-child selectors to wrap 3 divs using .wrapAll? I can't seem to work out the correct equation.

so...

<div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
</div>

becomes...

<div>
   <div class="new">
        <div></div>
        <div></div>
        <div></div>
   </div>
   <div class="new">
        <div></div>
        <div></div>
        <div></div>
   </div>
</div>

推荐答案

You can do it with .slice(), like this:

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

You can try out a demo here, all we're doing here is getting the elements you want to wrap and looping through them, doing a .wrapAll() in batches of 3 then moving to the next 3, etc. It will wrap 3 at a time and however many are left at the end, e.g. 3, 3, 3, 2 if that's the case.

Jquery相关问答推荐

我正在try 使用 Jquery 打开与帖子相关的特定评论

使用 jQuery / Javascript (querystring) 获取查询字符串参数 url 值

在 react js 中进行 API 调用的正确方法是什么?

从数组中删除第一个元素并返回减去第一个元素的数组

Rails 5:如何将 $(document).ready() 与 turbo-links 一起使用

如何使用 ES6 语法导入 jquery?

jquery 检测某些类的 div 已添加到 DOM

如何使用新的 JSON 数据手动更新数据表

粘性侧边栏:向下滚动时固定在底部,向上滚动时固定在顶部

如何在 JavaScript 或 jQuery 中过滤 JSON 数据?

使用 D3.js(IE、safari 和 chrome)创建 SVG 后,如何保存/导出 SVG 文件?

如何使用 jQuery 或纯 JavaScript 获取 URL 参数?

Chrome 中的 AJAX 发送选项而不是 GET/POST/PUT/DELETE?

试图检测浏览器关闭事件

即时替换 css 文件(并将新样式应用于页面)

jquery更改div类的样式属性

修改查询字符串而不重新加载页面

在 Bootstrap 3 中向工具提示添加换行符

有人可以解释如何实现 jQuery File Upload 插件吗?

如何检测 window.print() 完成