jquery - 创建包含现有元素的元素

Question

我需要创建一个 div，其中包含另一个 DOM 中已经存在的 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") 的引用，或者稍后使用它。如果函数不需要它来引用新元素会更好，只需使用另一种自动方式，但这不是真正的问题。

score 4 · Accepted Answer

看来您正在寻找wrap()：

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

此方法将在现有元素所在的确切位置插入新的包装器元素，并且不需要围绕包装器构建 jQuery 对象。

score 2 · Accepted Answer

2

你可以.wrap()这样使用 -

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

于 2013-05-17T13:38:03.723 回答

score 1 · Accepted Answer

可以使用该.on()方法来回答代码中的第二个问题（创建对新创建元素的引用）。如果您对所有新元素（IE，ID 都以“new”开头）有类似的命名约定，则此处理程序应该可以工作（单击，更改为您需要的内容）：

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

3 回答 3