Dom优化

Dom与浏览器

(1)重排与重绘

     -详细讲解:http://zhangyaochun.iteye.com/blog/1681641

(2)添加顺序:

   -尽量在appendChild前添加操作

(3)合并dom操作:

   -利用cssText

   -当需要对文档中大量dom进行操作时,可以先‘剪贴’dom,统一操作完成后再放回去

var div= document.getElementById("div");
div.style.cssText="200px;height:70px;display:bolck";

(4)缓存布局信息

   -一次取用,多次使用。减少对dom的操作

(5)文档碎片

    -类似于缓存池,

    -createDocumentFragment()

(6)Dom与事件

    -事件委托(利用冒泡的原理,把事件加到父级,子级元素触发执行效果)

    提高性能,新添加的元素也可以触发

(7)Dom与前端模板

    -能更好的对逻辑和视图分离,MVC

--来自“妙味课堂”的dom优化教程

原文地址:https://www.cnblogs.com/yunxianli/p/4255598.html