创建包含现有元素的元素

Question

我需要创建一个包含DOM中已经存在的另一个div的div。

<div class='a'></div>到<div class='b'><div class='a'></div></div>

我创建了一个代码来做到这一点，但它脱离现有的元素并将其安装在新的，所以它的父元素顺序会发生变化，这将在结尾处添加的父母。我认为这可能是未来的一个问题，例如，如果结构是用浮标管理的，也许？

所以我的代码是：

var obj = $('#existingDiv'); 
var p = obj.parent(); 
var d = obj.detach(); 
var n = p.append('<div id="newDiv"></div>'); 
$("#newdiv").append(d); 

这个代码的另一个问题是，我要创建新的div（id="newDiv"）的参考或whatelse以后使用它。如果函数不需要引用新元素，只需使用另一种自动方法，则会更好，但这不是真正的问题。

Answer 1

好像你正在寻找wrap()：

$("#existingDiv").wrap("<div id='newDiv'></div>"); 

这种方法将在准确位置的现有元素是插入新的包装元素，而并不需要打造一个包装一个jQuery对象。

Answer 2

您可以使用.wrap()这样的 -

$('div.a').wrap("<div class='b'></div>"); 

Answer 3

在你的代码回答第二个问题（创造新创建的元素的引用）可以与.on()方法来实现。如果你也有类似的命名约定的所有新元素（IE，ID的全部以“新”），该处理程序，就可以（为点击，改变你的需要）：

$(document).on('click', '[id^="new"]', function() { 
    //do stuff here 
    var currentID = $(this).attr("id"); // <--Grabs ID of clicked element 
}); 

API参考：http://api.jquery.com/on/