使用DOM方法更新頁面內容的另一個途徑是克隆已有DOM元素,而不是創建新的元素,也就是使用element.cloneNode(element是一個已存在的節點)代替document.createElement。
在大多數瀏覽器上,克隆節點更有效率,但提高得不太多。用克隆節點的辦法創建1000行表格,只創建一次單元格,然後重複執行複製操作,這樣會快一些。使用element.cloneNode創建表格的代碼如下:
function tableClonedDOM{
var i,table,thead,tbody,tr,th,td,a,ul,li,oth=document.createElement('th'),otd=document.createElement('td'),otr=document.createElement('tr'),oa=document.createElement('a'),oli=document.createElement('li'),oul=document.createElement('ul');
tbody=document.createElement('tbody');
for(i=1;i<=1000;i++){
tr=otr.cloneNode(false);
td=otd.cloneNode(false);
td.appendChild(document.createTextNode((i%2)?'yes':'no'));
tr.appendChild(td);
td=otd.cloneNode(false);
td.appendChild(document.createTextNode(i));
tr.appendChild(td);
td=otd.cloneNode(false);
td.appendChild(document.createTextNode('my name is#'+i));
tr.appendChild(td);
//....
}
//...
}