jQuery：单独添加还是一次追加+选择器？

我正在构建一个jQuery UI小部件，当我初始化时，我创建了几个div，锚点，输入。 我已经读过，构建一个完整的HTML字符串然后将其附加到DOM比附加每个单独的DOM元素更快。

但是，我稍后需要访问这些元素，所以我也倾向于单独构建它们然后附加它们，所以我已经将它们缓存而不是在我追加所有HTML之后选择它们。

什么通常更快？

例如：

var html = $('
.....several more divs, anchors and inputs all with IDs......
'); .append(html); this.container = $('#container'); this.search = $('#search'); ...and so on 

要么

 this.container = $('
'); this.search = $(''); ...and the rest of the divs, anchors and inputs then... .append(this.container).append(this.search) ..... and so on 

Answer 1

我还建议阅读这两篇博文

43,439正确使用append（）的理由

有关如何使用jQuery中的大量数据集提高代码性能的5个简单提示

Answer 2

这创建了一个非常快速的DOM片段，创建很多它们会变慢。

 var html = $('
.....several more divs, anchors and inputs all with IDs......
'); 

你可以通过给出你知道元素所在的有限上下文来加速选择器。

 this.container = html; //since #container is the top div in html, html = #container this.search = html.find('#search'); 

然后最后添加到DOM这是缓慢的附加，因为它导致浏览器重绘。

 .append(html); 

这将让你想要你想要的，而不必创建多个速度较慢的DOM片段。