将多个div与其他div组合

Question

我有几个div如下：

<div id='id1'>blabla</div>
<div id='id2'>blabla</div>
<div id='id3'>blabla</div>
<div id='id4'>blabla</div>
<div id='id5'>blabla</div>
<div id='id6'>blabla</div>

我想添加一个新的div（<div id='newdiv'>）来包装我指定的div。

例如，在"id3"之前和"id5"之后。因此我们获得：

<div id='id1'>blabla</div>
<div id='id2'>blabla</div>
<div id='newdiv'>
  <div id='id3'>blabla</div>
  <div id='id4'>blabla</div>
  <div id='id5'>blabla</div>
</div>
<div id='id6'>blabla</div>

你知道jQuery的代码吗？

Answer 1

使用jQuery.wrapaAll（）：

$('#id3, #id4, #id5').wrapAll('<div id="newdiv" />')

Fiddle：http://jsfiddle.net/K4HVR/

Answer 2

可能是一个简单的插件，使其更加灵活、可重用：

$.fn.customWrap = function (end, wrapperDivAttr) {
    this.nextUntil(end).next().addBack().add(this).wrapAll($('<div/>', wrapperDivAttr));
}
$('#id3').customWrap('#id5', { id: 'newDiv'}); // call the function on the startelement, specify the end elements selector and attribute obj.

nextUntil获取所有div直到结束div，然后next也选择结束div，addback（）将以前的元素（nextUntile）添加到集合中，然后add（）选择开始div，然后wrapAll。

演示

Answer 3

有点匆忙，所以这是未经测试的，但像这样吗？

 $("#id3, #id4, #id5").wrapAll('<div id="newdiv" />');

编辑：哦，该死的，看起来卡尔·安德烈打败了我！