Можно ли манипулировать элементом перед его вставкой в ​​DOM с помощью jquery?

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 .

Answer 2

попробуйте это:

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