Javascript 什么'；将JSON对象数组动态放置到表中的有效方法是什么？

我使用PapaParse创建了一个JSON对象2D关联数组（？）（数据对象有193行49列）。我想动态地将它添加到我的网页。下面的代码使用jQuery，但运行速度非常慢。有没有更快的办法

注意：我给单元格提供了唯一的ID，因为我希望用户能够以交互方式选择要保留的某些列

$('<table/>', {
          'id' : 'dataTable' 
    }).appendTo("body");

$('<tbody/>', {
        "id": "dataTableBody",
    }).appendTo("#dataTable");  


// cycle through values and add data to table

for (var i = 0; i < Parseddata.length; i++) {
    $('<tr/>', { 
        "id":"dataTableRow_"+i 
        }).appendTo("#dataTableBody");
    for (var j = 0; j < Parseddata[0].length; j++) {
        $('<td/>', {
            "id":"dataTableColumn_"+j,
            "text":Parseddata[i][j]
      }).appendTo("#dataTableRow_"+i).css({"border":"solid white 1pt"});
    };
};

$（“”{
“id”：“数据表”
}).附于（“主体”）；
$('', {
“id”：“dataTableBody”，
}).附于（“#数据表”）；
//循环浏览值并将数据添加到表中
for（var i=0；i

我认为最快的方法是使用html连接生成整个标记，然后将其附加到正文中

但同时，您可以延迟将表呈现到主体，直到构建整个表，这样浏览器的重画就不会被触发。。。所以试试看

var $table = $('<table/>', {
    'id': 'dataTable'
});

var $tbody = $('<tbody/>', {
    "id": "dataTableBody",
}).appendTo($table);


// cycle through values and add data to table
var $tr;
for (var i = 0; i < Parseddata.length; i++) {
    $tr = $('<tr/>', {
        "id": "dataTableRow_" + i
    }).appendTo($tbody);
    for (var j = 0; j < Parseddata[0].length; j++) {
        $('<td/>', {
            "id": "dataTableColumn_" + j,
                "text": Parseddata[i][j]
        }).appendTo($tr).css({
            "border": "solid white 1pt"
        });
    };
};

$table.appendTo("body");

var$table=$（“”{
“id”：“数据表”
});
变量$tbody=$（''{
“id”：“dataTableBody”，
}).附件（$表）；
//循环浏览值并将数据添加到表中
var$tr；
for（var i=0；i

---

也可以尝试下面这样的字符串连接

var html = [];
html.push('<table id="dataTable">');
html.push('<tbody id="dataTableBody">');

// cycle through values and add data to table
var $tr;
for (var i = 0; i < Parseddata.length; i++) {
    html.push('<tr id="dataTableRow_' + i + '">');
    for (var j = 0; j < Parseddata[0].length; j++) {
        html.push('<td id="dataTableColumn_' + i + '_' + j + '">');
        html.push(Parseddata[i][j]);
        html.push('</td>');
    };
    html.push('</tr>');
};

html.push('</tbody>');
html.push('</table>');

$('body').append(html.join(''))

var html=[]；
html.push（“”）；
html.push（“”）；
//循环浏览值并将数据添加到表中
var$tr；
for（var i=0；i

---

---

基准：

+1

供您参考