不能向新包装的元素追加jquery元素

Cannot append jquery element to newly wrapped element

本文关键字:元素 追加 jquery 包装 新包装 不能      更新时间:2023-09-26

我想在已经存在的div周围包装一个div,然后附加到新创建的父div。

// create parent
var $top = $('<div id="top">top</div>');
// wrap it around child
$('#middle').wrap($top);
// append to new parent
$top.append('<div id="bottom">bottom</div>');

下面是显示追加不起作用的jsfiddle ....

http://jsfiddle.net/3WRDc/2/

应该是这样的:

http://jsfiddle.net/3WRDc/1/

你知道为什么这么简单的操作序列不起作用吗?我知道我可以很容易地从父元素开始,然后附加两个子元素,但在这个例子中,我需要用这种特殊的方式。

wrap()克隆您指定的包装器。文档说(强调我的):

.wrap()函数可以接受任何字符串或对象传递给$()工厂函数以指定DOM结构。这结构可以嵌套几个层次,但应该只包含一个最里面的元素。该结构体的副本将被包裹匹配元素集合中的每个元素。这个方法返回用于链接的原始元素集。

您必须重新选择$top:

$("#top").append('<div id="bottom">bottom</div>');

http://jsfiddle.net/3WRDc/4/

使用.insertAfter()

var $top = $('<div id="top">top</div>');
$('#middle').wrap($top);
$('<div id="bottom">bottom</div>').insertAfter('#middle');