zoukankan      html  css  js  c++  java
  • DOM性能考虑

    访问DOM的方式对脚本性能会产生非常大的影响。

    if(document.getElementsByTagName('a').length>0){
        var links = document.getElementsByTagName('a');
        for(var i=0;i<links.length;i++){
            //对每个链接做点处理
        }
    }
    

    不管什么时候只要查询DOM中的某些元素,浏览器就会搜索真个DOM树,从中查找可能匹配的元素。

    document.getElementsByTagName("a"); //使用了两次浪费了一次

    最好的方法是把第一次搜索的结果保存在一个变量中,然后再循环里重用该结果,比如:

    var links = document.getElementsByTagName("a");
    if(links.length>0){
        for(var i=0;i<links.length;i++){
            //对每个链接做点处理
        }
    }
    

    ++PS:另外一个需要注意的地方,就是尽量减少文档中的标记数量。过多不必要的元素只会增加DOM树的规模,进而增加遍历DOM树以查找特定元素的时间。++


    结构化程序设计:有一条原则,函数一个入口和一个出口
    实际工作中,过分拘泥于这项原则往往会使代码变得非常难以阅读。个人认为,如果一个函数有多个出口,只要这些出口集中出现在函数的开头部分是可以接受的。

    function prepare(){
        if(!document.getElementsByTagName) return false;
        if(!document.getElementById)return false;
        if(!document.getElementsById("imagegallery"))return false;
    
  • 相关阅读:
    现代3D图形编程学习-关于本书
    极简单之爬虫入门
    前端学HTTP之网络基础
    用canvas 实现个图片三角化(LOW POLY)效果
    移动前端—图片压缩上传实践
    nodejs实现Websocket的数据接收发送
    nodejs学习之实现简易路由
    nodejs学习之实现http数据转发
    canvas粒子demo
    nodejs简易实现一下bigpipe
  • 原文地址:https://www.cnblogs.com/hynb/p/5950463.html
Copyright © 2011-2022 走看看