Question

在jQuery中，我如何使用div包装可重复的元素集？

例如我有：

img
h4
p  
img
h4
p
img
h4
p

我需要将每个img，h4，p设置为div class="container"。所以它看起来像：

<div class="container"> img h4 p </div>
<div class="container"> img h4 p </div>
<div class="container"> img h4 p </div>

我一直在嵌套div.containers！

Answer 1

您可以这样做：

var elems = $("#content").find("img, h4, p");
for(var i = 0; i < elems.length; i+=3) {
  elems.slice(i, i+3).wrapAll("<div class='container'></div>");
}

这可以通过选择这些元素所在的容器并抓住这些特定类型来实现，如果你想要的元素是一切，你可以用.find(selector)替换.children()，在这种情况下我用它来做父元素：

<div id="container"></div>

You can see a working demo here

Answer 2

您的示例非常简单，因此可以使用：

$("h4").each(function () {
  $(this).prev().andSelf().next().andSelf().wrapAll("<div class='container'/>");
});

demo here

如何在jQuery中包装repeatbale元素集？

2 个答案: