jquery 如何在列表中 Package 每组图像和下一个div?

gcuhipw9  于 2023-06-22  发布在  jQuery
关注(0)|答案(2)|浏览(84)

我想 Package 每组图像和下一个div,如示例所示:

<div class="group">

   <img class="slide" src="...">
   <div class="content">...</div>

   <img class="slide" src="...">
   <div class="content">...</div>

   <img class="slide" src="...">
   <div class="content">...</div>

   ...

</div>

<div class="group">

   <div class="subgroup">
      <img class="slide" src="...">
      <div class="content">...</div>
   </div>

   <div class="subgroup">
      <img class="slide" src="...">
      <div class="content">...</div>
   </div>

   <div class="subgroup">
      <img class="slide" src="...">
      <div class="content">...</div>
   </div>

   ...

</div>
eoxn13cs

eoxn13cs1#

试试这个

$(".group .slide").each(function(){
    $(this).next(".content").andSelf().wrapAll("<div class='subgroup' />");
});

Working Demo

6ioyuze2

6ioyuze22#

您可以获得所有幻灯片和内容元素。然后对返回的数组进行切片,形成元素的集合,然后将其 Package 在同一组中:

var childelements = $(".group > .slide , .group > .content");
for(var i = 0; i < childelements.length; i+=2) {
  childelements.slice(i, i+2).wrapAll('<div class="subgroup"></div>');
}

Working Demo

相关问题