【笔记】JavaScript DOM 编程艺术

第5章:最佳实践

1、向后兼容:为了使一些较老的浏览器也能很好的展示网页

(1)对象检测【主流】

function myFunction() {
    if( method ){    // 如果支持method方法
        method
    }
}    

(2)浏览器嗅探技术【逐渐被淘汰】

通过js检索浏览器品牌和版本信息

 

2、性能考虑:

  (1)减少访问DOM

// 两次访问DOM,效率低
if(document.getElementsByTagName("a").length > 0){
    var links = document.getElementsByTagName("a");
    for(var i=0; i<links.length; i++){
        // 对每个links处理
    }
}

// 访问一次DOM
var links = document.getElementsByTagName("a");
if(links.length > 0){
    for(var i=0; i<links.length; i++){
        // 对每个links处理
    }
}

  (2)尽量减少标记

  (3)合并多个js脚本文件

  (4)压缩js脚本

3、<a>标签的平稳退化处理方法

  (1)这样在禁用了js的浏览器还能正常访问超链接

<a href="url" onclick="showPic(this.href); return false;">点击查看图片</a>

  (2)将(1)中的onclick动作与HTML分离

function showPic() {
    // body...
}
window.onload = function () {
    showPic();
    firstFunction();
    SecondFunction();
    // 更好想要在文档加载完毕之后执行的脚本    
};

 

第七章:动态创建标记

未完

猜你喜欢

转载自www.cnblogs.com/chsobin/p/9613203.html