javascript - 是否可以在使用 jquery 将元素插入 DOM 之前对其进行操作？

Question

我知道已经有人问过这个问题，但从未真正详细说明过。我想将一个元素插入到我的页面的 DOM 中，但只有在使用 DOM 构建它之后才可以。我知道这是可能的，但似乎此功能仅部分有效。例如...

// this doesnt work
var theDiv = '<div></div>';
$(theDiv).append('<p>test</p>');
alert($(theDiv).html());

// this works
var theDiv = '<div></div>';
alert($(theDiv).html());

我希望有人能够阐明这个问题。

Answer 1

这不能按预期工作的原因是因为您每次都创建一个新的 jQuery 对象。

var theDiv = '<div></div>';
$(theDiv).append('<p>test</p>');  //Create a new jquery object and append a p
alert($(theDiv).html());  //create a new jquery object of just a div and output the html

如果你想解决这个问题，你只需要创建一个新变量来保存你的 jQuery 对象。

var theDiv = '<div></div>';
var $d = $(theDiv).append('<p>test</p>'); //create a new jQuery object and than append 
                                          //a p and store it in a variable
alert($d.html());  //output the contents of the variable's html

jsfiddle 上的代码示例.