Question

我使用jQuery API append()添加新元素：

$(selector).append('<div class="test"></div>')

我希望表达式返回刚刚附加的元素以供我进一步使用，但它返回$(selector)。那么，我怎样才能让jQuery返回刚刚附加的元素以避免重新选择它？

Answer 1

我认为这样做的方法是使用appendTo()

然后你可以做

$('<div class="test"></div>').appendTo(selector).css('background','blue');

或者你想做的任何事情。

这会导致您刚刚追加的div具有蓝色背景。

Answer 2

您只需存储对它的引用即可。请记住，在将$div添加到属于DOM的元素之前，应该使用var $div = $('<div class="test"></div>'); $(selector).append($div);进行所有操作，以避免多次回流。

{{1}}

Answer 3

您可以通过将html字符串传递给jQuery function来独立于append创建元素：

$('<div class="test"></div>');

您可以在append

中使用它

$(selector).append(/* $div = */$('<div class="test"></div>').… );

或appendTo

/* $div = */$('<div class="test"></div>').appendTo(selector).… ;

或者您只是将它们分成两个陈述。

Answer 4

这也可以。

<div class="inner">hellworld</div>
$('.inner').append('<p>paragraph</p>');

这将插入两个新的s和一个现有的作为正文的最后三个子节点

var $newdiv1 = $('<div id="object1"/>'),
newdiv2 = document.createElement('div'),
existingdiv1 = document.getElementById('foo');
$('body').append($newdiv1, [newdiv2, existingdiv1]);

Answer 5

请试试这个

$(selector).append('<div class="test"></div>').find('div.test:last-child')

Answer 6

您可以通过添加childern jQuery函数返回它，如本示例jsfiddle

$(selector).append('<div class="test"></div>').children('.test');

或者你可以使用prependTO jQuery函数，例如jsfiddle：

$('<div class="test"></div>').prependTo(selector);

Answer 7

也许你可以试试

var elt = $('<div class="test"></div>');
$(selector).append(elt);

或者使用appendTo而不是append，然后链接你需要的任何东西（ show（）在下面的例子中）

$('<div class="test"></div>').appendTo($(selector)).show()

jQuery：如何返回附加元素

7 个答案: