javascript - jQuery appendTo非常慢!

我有一个html表，它根据每个表行的自定义属性值的CSV列表重新排序。我正在使用以下功能来做到这一点：

for (var i = 0; i < arrCSV.length; i++)
{
  $('#' + tableId)
      .find('[fname = ' + arrCSV[i] + ']')
      .eq(0)
      .parents('tr')
      .eq(0)
      .appendTo('#' + tableId);
}

表结构为：

<table>
<tr>
 <td fname='f1'>something here</td>
</tr>
<tr>
 <td fname='f2'>something here</td>
</tr>
</table>

CSV可能是这样的“ f2，f1”

我发现这是执行速度非常慢的功能。非常感谢您提供任何优化方面的帮助。

编辑：
根据http://www.learningjquery.com/2009/03/43439-reasons-to-use-append-correctly上的文章，通过使用html串联字符串仅调用一次append，可以最大程度地提高性能。有人可以帮助使用这种技术解决我的问题吗？我不确定如何在for循环中获取s HTML并将其附加一次。

最佳答案

我建议尽可能少地查找元素。使用感兴趣的属性值作为键，将所有匹配的行存储到“哈希”中。遍历CSV，从哈希中选择相应的行，将其推入数组，然后使用先前找到的jQuery对象将数组的元素最后附加到表中。

var table = $('#' + tableId);
var rowHash = {};
table.find('[fname]').each( function() {
    rowHash[$(this).attr('fname')] = $(this).closest('tr');
});
var rows = [];
for (var i = 0; i < arrCSV.length; ++i)
{
    var row = rowHash[arrCSV[i]];
    if (row) {
       rows.push(row);
    }
}
$(rows).appendTo(table);

编辑：这似乎对我之前的代码略有改进，在我之前的代码中，我将每行追加到表中。我在具有1000行的表上进行了测试，对需要完全反转的表进行排序似乎需要大约1秒。

关于javascript - jQuery appendTo非常慢!，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/1069596/