,可以使用以下代码实现:
// 创建一个新的容器
var newContainer = $("<div></div>");
// 获取所有的div元素
var divs = $("div");
// 遍历div元素
divs.each(function(index) {
// 将当前div添加到新的容器中
newContainer.append($(this));
// 每4个div创建一个新的容器
if ((index + 1) % 4 === 0) {
// 添加新的容器到页面中
$("body").append(newContainer);
// 创建一个新的容器
newContainer = $("<div></div>");
}
});
// 如果最后一组div数量不足4个,将剩余的div添加到新的容器中
if (divs.length % 4 !== 0) {
$("body").append(newContainer);
}
这段代码通过遍历所有的div元素,每4个div创建一个新的容器,并将这4个div添加到新的容器中。最后,将新的容器添加到页面中。如果最后一组div数量不足4个,将剩余的div添加到新的容器中。
这个功能在前端开发中常用于将一组元素按照一定规则进行分组展示,可以用于实现图片墙、商品列表等布局。
领取专属 10元无门槛券
手把手带您无忧上云