《Web网站设计与开发教程》课件第4章.ppt

第4章脚本语言JavaScript

4.1JavaScript简介

4.2JavaScript的基本语法

4.3JavaScript的面向对象特性

4.4JavaScript在浏览器中的应用

4.5JavaScript在HTML5中的应用

4.6常用的JavaScript框架

【学习提示】如果说HTML文档创建了网页中的对象，

CSS设置了这些对象的属性值，那么JavaScript就可以让这

些对象活起来，并按照规定的程序动起来，因为JavaScript

是一种程序设计语言。作为一个热门的计算机语言，

JavaScript拥有大量的特性和优点，开发人员还可以在此基

础上扩展出各种复杂的应用。在很多云计算的环境中，我

们看到了用JavaScript作为主要开发工具实现的在线文档编

辑器(类似Word)、可交互的地图以及各种社交网络软件。

鉴于初学者的需要和知识结构的考虑，本章着重介绍

JavaScript语言最核心的特性和程序开发方法，特别是讨论

了其对浏览器对象的操纵。在此基础上，还介绍了几种目

前流行的JavaScript框架。

4.1JavaScript简介

JavaScript是由Netscape公司开发的一种基于对象、事

件驱动并具有相对安全性的客户端脚本语言。JavaScript可

以让网页产生动态、交互的效果，从而改善用户体验。目

前，JavaScript已成为Web客户端开发的主流脚本语言。

JavaScript由JavaScript核心语言、JavaScript客户端扩展

和JavaScript服务器端扩展三部分组成。核心语言部分包括

JavaScript的基本语法和JavaScript的内置对象，在客户端和

服务器端均可运行。客户端扩展部分支持浏览器的对象模

型DOM，可以很方便地控制页面上的对象。服务器端扩展

部分支持在服务器上运行时需要的对象，这些对象可以和

Web数据库连接，可以在应用程序之间交换信息，对服务

器上的文件进行控制。本书主要讨论JavaScript核心语言和

JavaScript客户端扩展的部分。

JavaScript和Java表面上看似存在某些联系，但是本质

上讲，它们是两种不同的语言。JavaScript是Netscape公司

的产品，是一种解释型的脚本语言；而Java是Sun公司(现

在已归于Oracle麾下)的产品，是一种面向对象程序设计语

言。从语法风格上看，JavaScript比较灵活自由，而Java是

一种强类型语言，语法比较严谨。它与Java名称上的近似，

是当时Netscape为了营销考虑与Sun公司达成协议的结果。

JavaScript程序是纯文本、无需编译的，任何文本编辑

器都可以编辑JavaScript文件。

虽然在JavaScript中并不强调完整的面向对象的概念，但是

JavaScript使用了一种叫“原型化继承”的模型，并且

JavaScript中也有作用域、闭包、继承、上下文对象等概念。

JavaScript通过script标签在HTML文档中嵌入脚本代

码，有两种嵌入脚本的方法：第一种方法，直接在HTML

文档中编写JavaScript代码如下：

scripttype=text/JavaScript

document.write(这是JavaScript！采用直接插入的方法！

);

/script

为了避免不支持JavaScript的浏览器将JavaScript程序解

译成纯文字，书写代码时可以将JavaScript程序放在HTML

的注释标签“!----”之间。例如：

scriptlanguage=JavaScripttype=text/JavaScript

!--document.write(这是JavaScript！采用直接插入的

方法！);--

/script

第二种方法，可以通过文件引用的方式将已经编写好

的JavaScript文件(通常以.js为扩展名)引入进来。这种方式

可以提高代码的重用性和可读性。例如：

scriptsrc＝foo.jslanguage=JavaScript

type=text/JavaScript/script

其中，src属性值就是脚本文件的地址。需要说明的是，

如果在script标签中指定了src属性，script标签中的其

他内容都会被忽略，即在一个script标签中要么将

JavaScript程序直接写入HTML文档，要么通过文件引用的

方式来实现，二者不能同时生效。例如：

scriptsrc＝foo.