2013-11-21 49 views
-1

之間是什麼最正確的解決方案:動態html添加到div,什麼是最正確的解決方案?

var html="<div>"; 
for(...){ 
    html +="asdfgh"; 
} 
html+="</div>"; 
document.getElementById('test').innerHTML= html; 

和:

document.getElementById('test').innerHTML="<div>"; 
for(...){ 
    document.getElementById('test').innerHTML +="asdfgh"; 
} 
document.getElementById('test').innerHTML +="</div>"; 
+0

#2比#1更糟的是,每一個的innerHTML更新時間以來,佈局需要重新計算。 – enhzflep

+0

我認爲第一種方法更好,因爲測試節點對象只被引用一次,它會更快。此外,它也取決於情況,如果有很多html中的字符串,那麼我認爲當字符串的大小達到一定長度時,將html寫入dom節點會更好。 –

+0

[將HTML字符串附加到DOM]可能的重複(http://stackoverflow.com/questions/7327056/appending-html-string-to-the-dom) – Alohci

回答

0

我喜歡第一個更好,因爲你只訪問dom一次添加你的新元素及其內容。顯然有很多其他的方式來做到這一點。

0

以下是有點快:
不要做在for循環中的字符串操作*

var html; 
html.push ("<div>"); 
for(...){ 
    // html +="asdfgh"; Inside for loop manipualting String is heavy. 
    html.push ("asdfgh"); 
} 
html.push ("</div>"); 
document.getElementById('test').innerHTML= html.join("\n"); 
相關問題