對於20個元素，哪個jQuery操作更快？

代碼1：對於20個元素，哪個jQuery操作更快？

$("#page").replaceWith(html_string)

代碼2：

$("#page .title").text("Hello")

我開始使用Mustache.js，jQuery.tmpl，並Coffeekup和我開始不知道什麼最佳做法是重新計 - 呈現html元素。

說我有一個項目列表，如here，我想通過模板框架使用JSON更改標題/標籤/圖像。我應該：

用一個新的html字符串替換整個列表本身？
用新的html字符串替換每個列表項目？
用json值只替換每個元素中的文本/屬性？

我知道最後一種情況將需要遍歷dom更多，但我不確定這是否是比替換整個html樹更多的性能影響。這個怎麼用？

來源

2011-02-22 Lance Pollard

我可以建議....分析！？！？ – Domenic 2011-02-22 18:29:22

您可以通過將代碼移到問題來改進標題.... – 2011-02-22 18:30:40

我傾向於認爲你不應該摧毀DOM元素只是爲了立即重新創建它們。

最後一種情況並沒有真正添加任何DOM遍歷，但它確實修改了DOM幾次而不是一次。

如果你關心性能，你總是可以使用detach()^[docs]方法從頁面中刪除元素，對其內容進行操作，然後附加它們。

// reference the container 
var ul = $('#myul'); 

    // select and detach the children 
var lis = ul.children().detach(); 

    // do your manipulation 
lis.each(function() { 
    // update the text 
}); 

    // reinsert them 
ul.append(lis);

的.detach()將保持元素及其所有的處理程序/數據完整，而你操縱它們。

來源

2011-02-22 18:33:11 user113716

jQuerytmpl模板是一個已編譯的javascript函數，它應該更快，然後呈現html字符串。

想象一下瀏覽器。它首先讀取所有的html並解析它。使用jQuery模板，您可以更進一步，爲瀏覽器提供已解析的對象。

像jQuery.tmpl這樣的編譯模板是我認爲的最快捷的方式，如果編碼好的話，它比任何html都快。

等待評論家SO！ :)

來源

2011-02-22 18:31:48 Luke

對於20個元素，哪個jQuery操作更快？

回答

相關問題