js節點，都知道3大類：

元素節點

屬性節點

文本節點

常用的呢元素節點，屬性節點。還有倆方法，setAttribute() getAttribute(),設置和獲取屬性值

在實際工作中呢，長長我們從後臺拿到一串數據，要在前臺頁面展示。
我們寫好一個html母版後，用for循環，在母版中加入數據，最後插入頁面。這個呢就是思路！

為了快捷方便，常常這麽幹，

var str="";

for(var i=0;i<data.length;i++){

　　str+="<div>"+data[i].detail+"</div>";

}

$(‘div‘).innerHTML=str;

但是這樣呢，影響頁面性能，在設置一些屬性什麽的時候不方便，太多的字符串拼接容易出錯，重要的是顯得很不專業！！

在大神的提點下，開始用這個鬼！

var fragment=document.createDocumentFragment();

fragment 就是一個節點碎片

此時我們可以這麽幹了

for(var i=0;i<data.length;i++){

　　var div=document.createElement(‘div‘);

　　div.className="ml";

　　div.innerHTML=data[i].detail；

　　fragment.appendChild(div);

}

$(‘div‘).appendChild(fragment);

這麽看著就高大上了吧！！！

js節點使用 碎片節點