javascript - 使用 JQuery 将数千行动态加载到表中

Question

我正在为 CRM 开发前端 GUI。我们有一个分层的客户结构。每个客户都有许多他们的账单地址、许多他们的送货地址以及与每个帐户关联的许多联系人。我遇到的问题是，有些客户有超过 10,000 个与该帐户关联的收货方。当同时调用所有这些时，这会成为一个问题。我的后端很好，它在大约 280 毫秒(平均)内获取所有发货数据。我使用 Javascript 将所有信息加载到表中。这是我目前正在做的事情:

    var r = new Array();
var j = -1, recordID;
r[++j] = '';

    //Loop through the data and build an array.
    for (i in data) {
        var d = data[i];
            recordID = d.id;
        r[++j] = '<tr>';
        r[++j] = '<td>'+ d['ADDRESS_LINE_1'] +'</td>';
        r[++j] = '</tr>';
    }
    //The line below joins the array and appends it to the table.
    $('#table').append(r.join(''));

我已经与为我构建规范的人交谈过，他们需要立即显示所有规范，不可能进行过滤。现在，加载所有数据并打开模式大约需要 4 秒。

有更快的方法吗？

Answer 1

$.map(yourArrayVar, function(value, key) {
   return '<TR><TD>'+value['ADDRESS_LINE_1']+'</TD></TR>';
});
$("#table").append(yourArrayVar.join(''));

这可以帮助您获得比循环更好的性能。在这里了解更多信息，http://api.jquery.com/jquery.map/