Javascript 累积jQuery html元素以添加到DOM

我正试图使用jQuery构建html元素，但我很难弄清楚如何映射数据集，构建所有html元素（如何存储？），然后一次性追加整个内容

buildHeader: () => {
    var $headerHtml = $();

    fields.map(f => {
        var $element = $("<td>", { class: "frb-das-header", text: f.title });
        $headerHtml = $headerHtml.append($element);
    });
    return $headerHtml.html();
},

buildHeader:（）=>{
变量$headerHtml=$（）；
fields.map（f=>{
var$element=$（“”，{class:“frb das头”，文本：f.title}）；
$headerHtml=$headerHtml.append（$element）；
});
返回$headerHtml.html（）；
},

我使用一个模板字符串

${this.buildHeader（）}

调用它，但我没有得到任何返回

用例：我有一个表，我想通过在数组上迭代、构建html，然后呈现出来来呈现所有的标题或表行

编辑：可以让它渲染，但它删除了我最初设置的

buildHeader: () => {
    var $headerHtml = $("<tr>", {
        class: "frb-das-headers"
    });

    frb.config.lizsts.das.tableFields.map(f => {
        $headerHtml.append(
            $("<td>", {
                class: "frb-das-header",
                text: f
            })
        );
    });
    return $headerHtml.html();
},

buildHeader:（）=>{
变量$headerHtml=$（“”{
类别：“frb das标题”
});
frb.config.lizsts.das.tableFields.map（f=>{
$headerHtml.append(
$("", {
类别：“frb das标头”，
正文：f
})
);
});
返回$headerHtml.html（）；
},

此代码迭代

标题

和

行

数组，创建html并将结果附加到

表

：

var headers=['A'，'B'，'C']；
变量行=[
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
$（文档）.ready（（）=>{
$（“表”）
.附加(
`${
reduce（（r，e）=>（r+=`${e}`）和&r`）
}
${
行。减少（（r，e）=>（r+=`${
e、 减少（（r，e）=>（r+=`${e}`）和&r`）
}`)&&r，”）
}`
)
});
表格{
边界塌陷：塌陷
}
运输署，
th{
文本对齐：居中；
填充：4px；
边框：实心1px；
}

$（）
是一个空的jQuery对象，
append（）
的目的是插入指定的内容作为jQuery集合中每个元素的最后一个子元素

因此，您不能将
append（）
$element
添加到
$headerHtml


let字段=[
{标题：“H1”}，
{标题：“H2”}，
{标题：“H3”}，
]
让buildHeader=函数（）{
//元素的首字母
变量$headerHtml=$（“”）；
fields.map（f=>{
变量$element=$（“”{
类别：“frb das标头”，
正文：f.标题
});
//将$element追加到
$headerHtml.append（$element）；
});
//获取该文件的外部TML
返回$headerHtml[0]。outerHTML；
//或
//返回$headerHtml.prop（“outerHTML”）；
}
$（“body”）.append（`${buildHeader（）}`）
我刚刚返回
null
我需要从数组中构建表头和行，我正在尝试构建html。