爲div動態添加更大的內容

Question

我使用的是當我將鼠標懸停在圖像上時顯示的div。我想用這個div來顯示圖像信息。如何添加幾行內容到div？我發現的唯一的溶劑是div的innerHTML屬性，但這意味着我必須使用它來獲得我希望放在div上的aech值。有沒有辦法讓我可以用一個命令在div上添加更多的內容。我想用javascript或dojo實現這一點。

Answer 1

每次使用innerHTML時，屏幕必須重新排列/重新繪製。更好的模式是創建一個文件片段並更新它「離線」之前，使信息「生活」：

var p, t, frag; 
divInf = document.createElement('div'); 
frag = document.createDocumentFragment(); 
p = document.createElement('p'); 
t = document.createTextNode('first line'); 
p.appendChild(t); 
frag.appendChild(p); 

p = document.createElement('p'); 
t = document.createTextNode('second line'); 
p.appendChild(t); 
frag.appendChild(p); 

divInf.appendChild(frag);