1、平稳退化(优雅降级)

  目的:当浏览器不支持js或者js被用户禁用时,做到即使不运行js,网页的可读性亦不会受到太大的影响。

  理念:使用最新的技术面向高级浏览器构建最强的功能及用户体验,然后针对低级的浏览器进行限制,逐步衰减那些无法被支持的功能及体验。使用平稳退化技术时,必须先完整的实现网站,其中包括所有的功能和特效。 然后再为那些无法支持所有功能的浏览器增加候选方案,使之在旧式的浏览器上以某种形式降级体验却不至于完全失效。

  做法:通过条件判断语句

例子:先针对Firefox或者Chrome等支持W3C标准的浏览器编写页面代码,然后修复IE中的异常或针对IE去除那些无法被实现的功能特色。

2、渐进增强:

  目的:当浏览器支持js时,不同浏览器不同版本对js的支持度都不一样,此时做到在保证站点页面在低级浏览器中的可用性和可访问性的基础上,逐步增强功能及提高用户体验。

  理念:让网站能够正常工作于尽可能旧的浏览器上,然后不断为它在新型浏览器上实现更多的增强和改进。随着时间的推移,当越来越多的人开始升级浏览器而浏览器本身的支持度也不断提升时,就会有越来越多的人体验到这些增强和改进,它持续有效的使网站越来越好,只要一次实现,它就让网站的体验与时俱进。

3、JavaScript分离

  将js和html文档分离,通过在</body>前引入的方式载入,这样做可以让代码看上去更加简洁规范,思路清晰,并且在载入页面的时候速度变快。

4、优化性能

  1)尽量减少访问dom的次数,因为每一次访问dom都会对整个dom进行扫描,从而占用系统资源,可以通过申明变量的方式来减少dom访问次数。

  2)js脚本尽量合并,减少引用载入次数。

  3)对脚本进行压缩,减少文档体积,加快页面加载速度,注意要保村好完整的副本,编写时用完整版,上传时先压缩再上传。

关于dom脚本编程的一些优秀理念总结的更多相关文章

  1. javascript学习 真正理解DOM脚本编程技术背后的思路和原则

    本文学习来源于<javascriptDOM编程艺术>仅作笔记 学会怎样才能利用DOM脚本编程技术以一种既方便自己更体贴用户的方式去充实和完善你们的网页. 循序渐进:从最核心的内容开始,逐步 ...

  2. javascript进阶——分离式DOM脚本编程

    编写分离式(unobstrusive)代码意味着对HTML内容的完全分离:数据来自服务器端,javascript代码用来动态化和交互.这种分离的好处是在不同浏览器之间使用是可以完全降级或升级运行,对于 ...

  3. Shell脚本编程学习入门 02

    Shell脚本编程学习入门是本文要介绍的内容,我们可以使用任意一种文字编辑器,比如gedit.kedit.emacs.vi等来编写shell脚本,它必须以如下行开始(必须放在文件的第一行):   #! ...

  4. 【Shell脚本编程系列】Shell脚本开发的习惯和规范

    1.开头指定脚本解释器 #!/bin/sh或#!/bin/bash 2.开头加版本版权信息 #Date #Author #Mail #Function #Version 提示:可配置vim编辑文件时自 ...

  5. centos shell脚本编程2 if 判断 case判断 shell脚本中的循环 for while shell中的函数 break continue test 命令 第三十六节课

    centos  shell脚本编程2 if 判断  case判断   shell脚本中的循环  for   while   shell中的函数  break  continue  test 命令   ...

  6. SVG脚本编程简介

    本文主要介绍SVG的脚本编程,并分别给出放大.缩小,查询,鼠标事件等实例. 一. SVG简介 SVG,全称为Scalable Vector Graphics(可伸缩矢量图形).它是W3C制定的.用矢量 ...

  7. 浅谈自底向上的Shell脚本编程及效率优化

    作者:沐星晨 出处:http://blog.csdn.net/sosodream/article/details/6276758 浅谈自底向上的Shell脚本编程及效率优化 小论文,大家多批评指导:) ...

  8. SHELL脚本编程基础知识

    SHELL脚本编程基础知识 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. Linux之父Linus有一句话很经典:"Talk is cheap, show me the ...

  9. Linux命令行与Shell脚本编程大全

    快来参加<Linux命令行与Shell脚本编程大全>学习吧,提升技能,展示自我. 点击链接即可进入学习:https://s.imooc.com/WTmCO6H 课程亮点适合零基础读者,从零 ...

随机推荐

  1. @PostConstruct 注解

    @PostConstruct 注解 /* * Copyright (c) 2005, 2010, Oracle and/or its affiliates. All rights reserved. ...

  2. java操作txt文本(二):删除文本括号内的内容

    想法由来:之前写读书报告时,遇到一些烦人的文献,总喜欢把注释作为括号内容放到正文中,使文章繁琐冗长,所以写了下面这个代码,剔除了括号内的内容. 适用条件:原txt文本中的括号使用正确,即左右括号匹配正 ...

  3. Mysql的2003错误 cant connect to mysql 10060的解决

    网上有很多这个问题,令人遗憾的是,都是复制粘贴的繁琐的命令行操作.我解决这个问题是在安装有可视化工具的前提下完成的.我想,使用Mysql数据库的大多数还是安装有可视化开发工具的吧,我就用phpMyAd ...

  4. HTML学习笔记汇总

    笔记几乎涵盖了日常开发中全部的知识点以及相关注意事项 想要学习网页制作的初学者可以通过本篇笔记初步掌握HTML的使用,也可以将该笔记作为查阅资料查看 HTML简单结构 <html> < ...

  5. Android设计模式之代理模式

    代理模式: 为其他对象提供一种代理以控制对这个对象的访问 Subject类定义了RealSubject和Proxy的共用接口,这样就在任何使用RealSubject的地方都可以使用Proxy inte ...

  6. javascript . 05 json的组成、for...in 遍历对象、简单数据类型与复杂数据类型的传值与传址、内置对象

    对象字面量  JSON var obj = { aaa :999}; var json={"aaa":999,"bbb":888}; "kay&quo ...

  7. 深入理解CPU和异构计算芯片GPU/FPGA/ASIC (上篇)

    王玉伟,腾讯TEG架构平台部平台开发中心基础研发组资深工程师,专注于为数据中心提供高效的异构加速云解决方案.目前,FPGA已在腾讯海量图片处理以及检测领域已规模上线. 随着互联网用户的快速增长,数据体 ...

  8. Android解析xml文件-采用DOM,PULL,SAX三种方法解析

    解析如下xml文件 <?xml version="1.0" encoding="UTF-8"?> <persons> <perso ...

  9. javaWEB与cookie

    Cookie1. Http协议与Cookie(了解)  * Cookie是HTTP协议制定的!先由服务器保存Cookie到浏览器,再下次浏览器请求服务器时把上一次请求得到Cookie再归还给服务器  ...

  10. Sublime Text前端开发环境配置

    Sublime Text是前端开发不可不说的编辑器,本文以Sublime Text 3为例讲解一下如何搭建前端的开发环境. 下载Sublime Text 3 下载地址 #==> Sublime ...