高性能JS笔记3——DOM编程

一、访问与修改DOM

 DOM和JS 相当于两个岛屿，访问操作的次数越多，要交的过路费越多，对性能产生很大影响。

 减少访问DOM的次数，把运算尽量留在JS端操作。

二、innerHTML 对比 DOM 方法

 

1、对于原生的DOM方法和innerHTML比较，性能相差无几。

2、对于大量操作，针对不同浏览器，性能不一样，因此取决于经常用的浏览器。

3、建议从可读性、稳定性、编码习惯来决定使用哪种方式。在对字符串经过优化后，innerHTML性能可以得到大幅提升。

三、操作上的优化

1、节点克隆

例如：

var tr = document.createElement("tr");
var otd = document.createElement("td");
for(var i = 1; i<=1000; i++)
{
    tr.appendChild(otd.cloneNode(false));
}

View Code