4.5.1 JavaScript概述
1.JavaScript简介
JavaScript是面向Web的一种解释性的脚本编程语言。脚本,是一种能够实现特殊功能的程序代码片段,它不像一般的程序那样被编译,而是在程序运行过程中被逐行解释。它允许创建自定义的逻辑命令和程序,实现Web页面的交互处理。因此JavaScript是在程序的运行过程中逐行进行解释的,而不需要像C、C++等语言先编译后执行。它基于对象和事件驱动,可以与HTML相结合,增强Web与用户之间的交互性,是Web的一个重要组成部分。互动性功能如图像操作、表单验证以及动态内容更新基本都在客户端完成,不会增加Web服务器的负担。客户端的JavaScript必须要有浏览器的支持,用户点击带有JavaScript的活动页面时,页面里的JavaScript代码就传到客户端浏览器,由浏览器解释执行。随着引擎和框架的发展,JavaScript也逐渐用于服务器端编程。
JavaScript是由网景(Netscape)公司于1995年创建。在Web发展初期的主要作用是处理以前由服务器端语言(如Perl)负责的一些输入验证操作。之后,JavaScript逐渐成为常见浏览器必备的一项特色功能,其功能已从简单的数据验证扩展至复杂的计算和交互处理。网景公司将这门语言作为标准提交给了欧洲计算机制造商协会(ECMA,European Computer Manufacturers Association),“ECMAScript”则成为这门语言的标准版本。1997年发布了ECMA-262语言规范ECMAScript。“JavaScript”是指网景对这门语言的实现,而微软对这门语言的实现版本被称为“JScript”。由于JavaScript的日益流行,“ECMAScript”这一语言标准也在不断修订完善,以满足不断增长的Web开发需求。
一个完整的JavaScript实现包含如图4-23所示的3个不同的组成部分。
图4-23 JavaScript实现的组成部分
(1)核心(ECMAScript)
ECMAScript提供核心语言功能,它规定了这门语言的语法、数据类型、关键字、保留字、操作符、语句、对象等,但并未定义输入和输出。输入和输出的功能是由JavaScript所属的“宿主环境”(hostenviroment)提供的。常见的Web浏览器就是ECMAScript实现可能的宿主环境之一。宿主环境不仅提供基本的ECMAScript实现,同时也会提供该语言的扩展,以便语言与环境之间对接交互。JavaScript的语法和编程风格与Java类似,但它却不是Java的“轻量级”版本,实际上它和Java是完全不同的两种编程语言。
(2)浏览器对象模型
浏览器对象模型(BOM,Browser Object Model)可以提供与浏览器交互的方法和接口。使用BOM可以控制浏览器显示以外的部分,实现如弹出新浏览器窗口,移动、缩放和关闭浏览器窗口,提供浏览器详细信息、用户显示器分辨率详细信息,支持cookie等功能。HTML5已把很多BOM功能写入正式规范。BOM由多个对象构成,其中的顶层对象是Window对象,代表了浏览器窗口。其他对象如Navigator、Location、Screen、History等都是Window对象的子对象。
(3)文档对象模型
文档对象模型(DOM,Document Object Model)提供访问和操作页面内容的方法和接口,是针对XML但经过扩展也可用于HTML的API。DOM把整个页面映射为一个多层节点结构,页面中的每个组成部分,如元素、属性等都视为某种类型的节点,借助DOM提供的API,开发人员可以轻松自如地删除、添加、替换或修改任何节点,从而实现对文档的访问和操作。
JavaScript的这3个组成部分,在当前主要商用浏览器中都得到了不同程度的支持。本节将在后续部分介绍ECMAScript,而DOM的使用将在4.6节中结合XML文档做简要介绍。
2.在HTML中使用JavaScript
可以通过使用script元素向HTML页面中插入JavaScript代码。script标签用于定义客户端脚本,script元素既可以包含脚本语句,也可以通过src属性链接外部脚本文件。其语法结构及主要属性说明如下。
scr ipt属性=“属性值“…属性=“属性值“…/scr ipt
·type属性:必选,规定脚本的MIME类型,常用值为text/javascript。
·src属性:规定外部脚本文件的URL。
·async属性:规定异步执行脚本(仅适用于外部脚本)。
·charset属性:规定在外部脚本文件中使用的字符编码。
·defer属性:规定是否对脚本执行进行延迟,直到页面加载为止。
使用script元素插入JavaScript的方式有两种:直接在页面中嵌入JavaScript代码和链入外部JavaScript文件。
在页面中直接嵌入JavaScript代码时,只需为script指定type属性。Javascript程序可以如【例4-20】所示放在HTML页面的body、/body之间,也可以放在head元素中。包含在script元素内部的JavaScript代码通常将被从上至下依次解释。
【例4-20】script元素的使用示例。
假如JavaScript的脚本代码比较复杂或程序被多个HTML页面使用,则可以将这个JavaScript程序放到一个后缀名为.js的文本文件里,通过在HTML里引用这个外部文件,从而提高代码的复用性,减少代码维护的负担。在HTML里引用外部文件,通常应在head元素中写入下述语句,其中src属性值即是JavaScript文件的URL,例如
scr ipt type=“text/javascr ipt“src=“example.js“/scr ipt
与解析嵌入页面的JavaScript代码类似,在解析外部JavaScript文件时,页面的处理也会暂时停止。
3.简单示例
JavaScript程序是文本文件,既可以使用任何文本编辑器如记事本,也可以使用如Dreamweaver这样的专业编辑软件作为程序编辑器。下面以使用记事本为例,给出一个在页面输出“欢迎进入BestBook书店!”的JavaScript代码。
【例4-21】一个简单的JavaScript示例。
打开记事本,输入上述代码,再将文件另存为“hi.html”。在浏览器中打开这个文档,可以看到如图4-24所示的效果。上面的例子中,使用了document.wirte(),这是JavaScript中非常常用的语句,使用了document对象的write方法将字符串“欢迎进入BestBook书店!”输出显示在浏览器窗口里。
图4-24 JavaScript示例的显示效果