Javascript 将jQuery克隆的虚拟元素数组转换为单个对象_Javascript_Jquery

Javascript 将jQuery克隆的虚拟元素数组转换为单个对象

javascript jquery

Javascript 将jQuery克隆的虚拟元素数组转换为单个对象,javascript,jquery,Javascript,Jquery,考虑以下几点： var final = $(); virtual_elements.forEach(item => { $(final).append(item); }); 我有一个生成HTML文本块的模板函数，还有一些简单的数据 function template(item) { let HTML = `<div>`; HTML += `<span>${item}</span>`; HTML += `</div

考虑以下几点：

var final = $();

virtual_elements.forEach(item => {
    $(final).append(item);
});

我有一个生成HTML文本块的模板函数，还有一些简单的数据

function template(item) {
    let HTML = `<div>`;
    HTML += `<span>${item}</span>`;
    HTML += `</div>`;
    return HTML;
}

var data = [
    { name: 'foo' },
    { name: 'bar' },
    { name: 'baz' },
];

因此，我最终得到了一个DOM对象数组，其中每一个对象都可以与

$（target）.append（element）

或

$（element）.appendTo（target）

结合使用

然而，我试图实现的是将它们都变成一个对象，也可以附加到某个地方

有没有办法创建某种可以附加到的空jQuery对象？我尝试了以下方法：

var final = $();

virtual_elements.forEach(item => {
    $(final).append(item);
});

或

但这两种情况都会导致一个空对象

我也试过：

var final;

virtual_elements.forEach((item, index) => {
    if (index === 0) { final = item; }
    else { $(item).insertAfter(final) }
});

但它会生成一个包含单个项的对象

PS：将所有普通文本粘在一起，然后使用

$。parseHTML

对我来说不是一个选项，因为我需要在数据中的每个项中运行jQuery方法，这些方法仅适用于DOM节点，而不是纯文本。为了简单起见，我在代码中省略了这一点，但一个简单的示例是（在克隆元素之后）：

然后创建最终对象：

var final = {};

elements.forEach((item, index) => {
    final[index] = item;
});

您可以使用诸如

$（final）.replaceWith（target）

或

$（target）.append（final）

或简单地

$（data.map（x=>template（x.name）））

@Andreas我需要在克隆对象后首先对其进行操作，因此无法直接使用map函数。另外，您建议我在空的

var final=$（）

对象上使用

$.add（）

的确切位置是什么？克隆（false）部分毫无意义

$（html）

将

html

中的标记转换为实际的DOM节点（包装在jQuery对象中）。然后克隆它们，并仅存储克隆。使用

$（html）

创建的元素将被丢弃

const virtual_elements=$（data.map（x=>$（template（x.name）））

执行完全相同的操作。@Andreas

$（html）

不是jQuery方法。

$（）

中的

html

是我在forEach循环中声明的变量。我想你误解了我的密码。另外，检查我问题的PS部分。我首先需要将这个纯文本转换为DOM节点，这样我就可以对每个项使用jQuery操作方法。在完成所有这些之后，我最终得到了3个或更多的jQuery对象，我需要将它们转换为一个。“需要将此纯文本转换为DOM节点”-这已经发生在

$（html）