zoukankan      html  css  js  c++  java
  • 限制通过DOM操作所引发回流的次数

    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属性缓存在一个本地变量中,这样就能大幅度的提高循环的效率。转载这里:http://www.w3cgroup.com/article.asp?id=255

  • 相关阅读:
    spring boot下载本地静态文件最实用
    非常实用的MySQL中if、ifnull函数以及case/when的使用
    java获取访问地址IP的简单方法
    Oracle数据库视图的创建以及使用
    http-post调用接口简单代码
    orale数据库to_char时间中英文转换
    java线程的简单实用
    java小数保留位数四舍五入
    二项式反演
    学习总结-后缀数组
  • 原文地址:https://www.cnblogs.com/0banana0/p/2073872.html
Copyright © 2011-2022 走看看