- getElementsByTagName()方法返回的是包含零或多个元素的HTMLCollection对象，作为一个动态集合，该对象与NodeList非常相似。本质上来说，所有NodeList对象都是在访问DOM文档时实时运行的查询。所以应该尽量减少访问NodeList的次数，可以考虑将从NodeList中取得的值缓存起来：
//IE8及以前版本中无效
var array=Array.prototype.slice.call(nodeList,0);
或者仅保存其中某个要用到的属性：
for(var i=0,len=nodeList.length;i<len;i++){
dosomething();
}
- 频繁地添加DOM元素会导致浏览器反复渲染新信息，可以使用createDocumentFragment创建一个文档片段保存要创建的元素，再一次把他们添加到文档中：
var fragment=document.createDocumentFragment();
fragment.appendChild(document.createTextNode('Item'));
document.body.appendChild(fragment);
- 在插入大量HTML标记时，使用innerHTML属性与通过多次DOM操作先创建节点再指定它们的关系相比，效率要高很多。因为在设置innerHTML或outerHTML时会创建一个HTML解析器，这个解析器时在浏览器级别的代码基础上运行的，比执行js要快得多。
但是不可避免创建HTML解析器也会带来性能损失，因此最好能够将设置innerHTML的次数控制在合理的范围内，至少不要在循环中设置innerHTML，可以先创建一个字符串，最后一次性将结果赋值给innerHTML：
var text='';
for(var i=0,len=array.length;i<len;i++){
text+='color';
}
element.innerHTML=text;
4.事件委托
事件委托利用了事件冒泡，只指定一个事件处理程序就可以处理一个类型的所有事件。
list.addEventListener('click',function(event){
switch (event.target.id){
case 'item1':
break;
case 'item2':
break;
}
},false)
