如何在jQuery中包装具有不同类名的DIV标签？

可能重复：
如何将父元素添加到一组段落中？

我在文档中重复了以下HTML块

 
 My first div 
 
 My second div 
  
 My first div 
 
 My second div 
 ... 

如何用jQuery包装Divs以获得这样的结果HTML …

  
 
 My first div 
 
 My second div 
 
  
 
 My first div 
 
 My second div 
 
 ... 

Answer 1

你很幸运，这正是wrapAll的用途：

 $(".first, .second").wrapAll('
'); 

实例 | 资源

---

您的编辑显着改变了问题。 如果只需要在某个包含的块中执行上述操作，则可以遍历包含的块并仅将wrapAll应用于其内容。 您需要一种方法来确定您想要对div进行分组的方式，您尚未在问题中指定。

如果div周围有某种容器，你可以这样做：

 $(".block").each(function() { $(this).find(".first, .second").wrapAll('
'); }); 

在那个例子中，我假设div在一个带有"block"类的容器中。

实例 | 资源

如果没有结构方法来识别它们，你将不得不以其他方式做到这一点。 例如，在这里我们假设任何时候我们看到first ，我们应该停止分组：

 var current = $(); $(".first, .second").each(function() { var $this = $(this); if ($this.hasClass('first')) { doTheWrap(current); current = $(); } current = current.add(this); }); doTheWrap(current); function doTheWrap(d) { d.wrapAll('
'); } 

实例 | 资源

这是因为$()以文档顺序为你提供元素，所以如果我们按顺序遍历它们，保存它们，然后在我们看到新的first一个时将它们包起来（当然，最后清理一下） ），你得到了理想的结果。

或者这是另一种做同样事情的方法，它不使用wrapAll 。 它依赖于第一个匹配的元素是first （所以在first s之前没有second ！）：

 var current; $(".first, .second").each(function() { var $this = $(this); if ($this.hasClass('first')) { current = $('
').insertBefore(this); } current.append(this); }); 

实例 | 资源

Answer 2

 $('div').wrapAll('
'); 

会这样做，但也可以包装任何其他divs：

 $('.first, .second').wrapAll('
'); 

更好。