不管用js还是jquery,我们总是能遇到频繁修改dom树的情况。而每次修改dom树,都会触发浏览器的绘制操作。尽管浏览器绘制过程比较智能,也比较快速。但是如果太频繁的修改dom树,浏览器也有吃不消的时候。因此我们要汇总批量修改dom的时候,就需要使用技巧来保证浏览器不会卡壳。
通过这些步骤来减少重绘和重排的次数
1、使元素脱离文档流
2、对其应用多重改变
3、把元素带回文档
这个过程只有第一、三会触发重排,如果忽略这两个步骤,那么第二步所产生的任何修改都会触发一次重排。
有三种方法使Dom脱离文档
1、隐藏元素,应用修改,重新显示
2、使用文档片段在当前DOM之外构建一个子树,再把它拷贝回文档
3、将原始原始拷贝到一个脱离文档的节点中,修改副本,完成后再替换原始元素
-----------------------------------------------------
转载请注明来源此处
原地址:#
发表