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

Question

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

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

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

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

如何创建两个唯一的 div 元素以附加到 html 正文？

score 9 · Accepted Answer

您正在选择 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');

score 4 · Accepted Answer

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

$('div');

因此，以下代码将“可选择”的 id 应用于所有 div 元素。

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

要在 jQuery 中创建元素，您需要有一个以 '<' 开头的字符串。要获得您想要的结果，您可能需要执行以下操作：

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

你也可以这样做：

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

score 0 · Accepted Answer

快速破解？

此代码从DOM 中选择匹配的元素

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

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

所以例如

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

3 回答 3