jQuery：$（模板）与 .clone（）答案

【问题标题】：jQuery: $(template) vs .clone()jQuery：$（模板）与 .clone（）
【发布时间】：2012-10-10 23:05:07
【问题描述】：

假设我们有一个复杂的字符串template（可能是一个包含许多其他标签的 div..），我们需要多次将此 HTML 节点添加到我们现有的文档中。

每次从模板创建 HTML 节点会不会更快

var $html = $(template); // 1st run
var $html = $(template); // 2st run
...

或者只创建一次然后克隆它们：

var $template = $(template); // init
var $html = $template.clone() // 1st run
var $html = $template.clone() // 2st run
...

【问题讨论】：

【解决方案1】：

在迄今为止测试的所有浏览器上，使用短模板似乎总是比克隆更快，除了 Opera（一个测试用例，相同的性能）。谢谢大家的测试用例。

更新：

这是一个用jQuery构建的长模板和模板的测试：

最后的测试表明，在 Chrome、Firefox 和 Opera 上，clone 方法的性能远远优于模板方法，但在 IE9 中它们是相同的

【讨论】：

克隆在当前 Firefox 上也比模板慢 22%。
克隆在 Chromium 中慢了 6%。但是对于更复杂的内容，它会明显更快：jsperf
感谢您设置测试用例。但这并不能完全反映我的需要。我真的需要这个对$(template) 的调用，因为我需要修改生成的 HTML 节点（添加事件处理程序等）。我更新了测试，似乎改变了结果：jsperf.com/clone-versus-template/3
@lrsjng 谢谢，我将通过我的浏览器运行第三个修订版
@lrsjng 也许你想使用nrodic提供的更长的模板？