将Jquery创建的html元素存储在变量中

Question

我正在尝试向我的html主体添加两个div元素，我首先创建div元素，分配一个唯一的id并将它们存储在两个变量中。

var a = $('div').attr('id', 'container');         
var b= $('div').attr('id', 'selectable');     

 $(a).appendTo('body');
 $(b).appendTo('body); 

问题是当我将它们添加到主体时，我注意到实际上只有一个div元素被附加到主体上。经过进一步检查，我注意到变量b中的内容被复制到变量a，因此变量a和b都指向具有ID可选择的相同div。

如何创建两个要附加到html主体的唯一div元素？

Answer 1

您正在选择div，而不是创建它们。

var a = $('div').attr('id', 'container');
var b = $('div').attr('id', 'selectable'); 

应该是：

var a = $('<div/>').attr('id', 'container');
var b = $('<div/>').attr('id', 'selectable'); 

Answer 2

这会在dom中搜索所有div元素：

$('div');

以下代码正在应用＆＃39; selectable＆＃39;所有div元素。

var a = $('div').attr('id', 'container');         
var b = $('div').attr('id', 'selectable');

要在jQuery中创建元素，您需要有一个以＆＃39;＆lt;＆＃39;开头的字符串。要获得所需的结果，您可能希望执行以下操作：

var a = $('<div/>').attr('id', 'container');
a.appendTo('body');

你也可以这样做：

var a = $('<div id="container" />').appendTo('body');

Answer 3

快速入侵？

此代码 SELECTS 匹配来自DOM的元素

var a = $('div').attr('id', 'container');

要在变量中存储某个div，请使用jQuery的.clone();方法。

所以例如

var div_copy = $('div').clone(); //Saved for later use