zoukankan      html  css  js  c++  java
  • js性能优化篇创建文档碎片

    大家都知道,大量的操作DOM会引起页面的渲染变慢,文档碎片是指一个临时的文档,把创建的dom放到文档里面,不要每次操作都操作DOM,提高页面的效率。下面我们就来看一下如何运用创建文档碎片。

      首先,我们了解下向页面创建dom发生了什么。

     for(var i=0;i<5000;i++){
               var oSpan=document.createElement('span')
              document.body.appendChild(oSpan)
    
           }
        
    

    如果我们向以上代码一样,向页面插入很多dom元素,这种渲染的过程是十分缓慢的。

    为了解决这个问题,我们可以使用文档碎片createDocumentFragmnet()的方法,即创建一个文档碎片,把需要创建的文档放到文档碎片中,然后再一次性的添加到页面中,这样以来在一定程度上提高页面速度。

       var oDiv = createDocumentFragment('div')
           for(var i=0;i<5000;i++){
               var oSpan=document.createElement('span')
                  oDiv.appendChild(oSpan)
            
    
           }
    document.body.appendChild(oDiv)
    
     
     
  • 相关阅读:
    mysql 查询当月天数
    mybatis <collection>标签 类型为string时无法获取重复数据错误
    eclipse 关闭validating
    YAGNI 声明
    tomcat 异常
    svn 用cmd命令行启动服务
    linux 命令
    windows10安装liux系统
    一带一路是个啥?
    串口通信协议
  • 原文地址:https://www.cnblogs.com/tfl123/p/8075353.html
Copyright © 2011-2022 走看看