Javaseript DOM脚本程序设计的发展与应用方法

吴瑕

（四川职业技术学院，四川 遂宁 629000）

【摘要】DOM真正将HTML/XHTML、CSS和Javascript凝聚在一起，形成了功能强大的Javascript DOM脚本程序设计，本文对DOM Javascript脚本程序设计的发展与应用方法做了简要探讨。

教育期刊网 http://www.jyqkw.com
关键词 Javascript DOM；脚本程序设计；平稳退化

0　前言

近年来网页的内容越来越富于变化与色彩，网页设计技术从最初的HTML，再到CSS、Javascript，直到W3C（万维网联盟）推出的标准化DOM（Document Object Model文档对象模型），网页设计工作从过去的混乱无序状态，逐渐发展为一种有着成熟设计原则可循的流水线作业。

1　Javascript DOM脚本程序设计的发展

Javascript是由Netscape公司与Sun公司合作开发的，诞生于1995年，它的出现使网页内容不再局限于枯燥的文本，使网页实现了可交互性。但是早期的Javascript并不受欢迎，原因有多种，如：早期的浏览器彼此很少兼容、Javascript的网页访问性差，早期的程序员对Javascript不遵守相关标准和编程准则的滥用，导致各种问题。如今，随着W3C推出的标准DOM，情况极大改变，几乎所有浏览器都支持DOM，DOM真正将HTML/XHTML、CSS和Javascript凝聚在一起，形成了功能强大的Javascript DOM脚本程序设计，只要应用得当，它将成为Web开发中又一不可缺少的重要工具。

2　Javascript DOM脚本程序的应用方法

2.1　规范应用Javascript

Javascript是Javascript DOM脚本程序设计的基础语言，易学易用，其早期的应用存在不规范，很大程度上造成了人们对Javascript的恶劣印象，所以应该做到规范应用Javascript。首先可以从以下几方面出发：

1）Javascript代码单独保存成.js文件或者把这条脚本语句加在网页文档末尾 ，body之前，这样做不但DOM可以正常工作，而且实现了完美的平稳退化，效率极高。

2.4　性能优化

在编写Javascript DOM脚本程序时，还应该注意脚本对 web应用整体性能的影响，所以还应该注意一些问题：

1）尽量少访问DOM

程序运行document.getElementsByTagName(“a”)都会遍历一遍DOM树，如下程序：

if(document.getElementsByTagName(“a”).length>0)

{var links= document.getElementsByTagName(“a”);

For(var i=0;i

…//对每个a节点的处理

}}

这段代码就要遍历两次DOM树，造成搜索浪费，可以将搜索的结果保存在一个变量中，如果是多个函数中还可以考虑保存在一个全局变量中，提高程序执行效率。

2）和尽量减少HTML标记

3）合并放置脚本

4）压缩脚本

3　总结

本文对DOM Javascript脚本程序设计的发展与应用方法做了简要探讨，总之对DOM Javascript脚本程序开发的学习和应用需要一定的实践经验，只有勤于思考，善于借鉴，不断总结应用技巧，才能编写出高品质的脚本。

［责任编辑：薛俊歌］