createDocumentFragment() 创建文档碎片节点

var aqiData = [
["北京", 90],
["上海", 50],
["福州", 10],
["广州", 50],
["成都", 90],
["西安", 100]
];

(function () {
var box = aqiData.filter(function(arr){
return arr[1]>60
}).sort(function(num1,num2){
return num2[1]-num1[1];
});
var liFragment = document.createDocumentFragment();//加注
for(var i=0;i<box.length;i++){
var li = document.createElement('li');
var text = document.createTextNode('第' + (i+1) + '名: ' + box[i]);
li.appendChild(text);
liFragment.appendChild(li);
}
document.getElementById('aqi-list').appendChild(liFragment);
})();

如果没有加粗部分，那么每次添加li节点的时候都会调用一次appendChild函数。

如果先创建一个文档碎片节点createDocumentFragment()，那么就是先把li节点放入集合中，

当添加到aqi-list的时候一次性放入其中，节省了性能。