使用jQuery性能创建DOM元素

Question

目前我正在使用以下代码将某些元素附加到DOM：

$('<p/>', { html: data } ).appendTo('.columnLeft');

但是因为需要添加很多元素，所以我对性能有点担心。在我使用{ html: data }之前，我尝试了{ text: data }。但是因为有时候数据变量中有html我把它改为{ html: data }。我真的没有测量性能的工具，所以我想知道这里有人知道什么是更快的吗？

感谢阅读！

如下所述，我已经创建了自己的测试用例，您可以看到它here。根据测试，亚当给出的解决方案是最快的。

Answer 1

使用jQuery将HTML元素附加到DOM的最快方法是将它们作为HTML字符串附加，如下所示：

var myHTML = '<p>'+data+'</p>';
$('.columnLeft').append(myHTML);

这样，jQuery在实际附加到DOM之前不会经历必须创建DOM元素的过程。