原文转载:
1.在对当前DOM进行操作之前,尽可能多的做一些准备工作,保证N次创建,1次写入。
2.在对DOM操作之前,把要操作的元素,先从当前DOM结构中删除: 1. 通过removeChild()或者replaceChild()实现真正意义上的删除。 2. 设置该元素的display样式为“none”。 修改操作完成后,将上面这个过程反转过来,建议使用第2种方式。 3.CSS部分 另外一个经常引起回流操作的情况是通过style属性对元素的外观进行修改,如element.style.backgroundColor = "blue"; 每次修改元素的style属性,都肯定会触发回流操作,要解决这个问题可以: 1.使用更改className的方式替换style.xxx=xxx的方式。 2.使用style.cssText = '';一次写入样式。 3. 避免设置过多的行内样式 4. 添加的结构外元素尽量设置它们的位置为fixed或absolute 5. 避免使用表格来布局 6. 避免在CSS中使用JavaScript expressions(IE only) 4.将获取的DOM数据缓存起来。这种方法,对获取那些会触发回流操作的属性(比如offsetWidth等)尤为重要。 5.当对HTMLCollection对象进行操作时,应该将访问的次数尽可能的降至最低,最简单的,你可以将length属性缓存在一个本地变量中,这样就能大幅度的提高循环的效率。转载这里: