第1章 JavaScript基础.ppt

1、第1章 JavaScript基础,JavaScript是一种描述性的脚本语言，将JavaScript写入到Web页面当中，能使得原来静态的Web页面增加许多炫丽的效果，并使得网页的表现形式更加生动活泼。,1.1 脚本语言的介绍,JavaScript是脚本语言的一种，在本节里将会介绍什么是脚本语言、常用的脚本语言有哪些，以及这些脚本语言之间的区别。,1.1.1 什么是脚本语言,脚本语言（Scripting Language）是一种简单的程序，这些程序是由一些ASCII字符构成，可以使用任何一种文本编辑器来编写。以往的一些程序语言（如C、C+、Java等）都必须经过编译，将源代码编译成二进制的可执

2、行文件之后才能运行，而脚本语言不需要事先编译，只要有一个与其相适应的解释器（Interpreter）就可以执行。,1.1.2 脚本语言的分类,脚本语言可以简单地分为两类：服务器端脚本语言和客户端脚本语言。 顾名思义，服务器端脚本语言就是在服务器上执行的脚本语言。常用的服务器端脚本语言有ASP、JSP、PHP等。使用服务器端脚本，大多数执行过程都在服务器上完成，服务器将运行后的结果返回给客户端。因此，服务器端脚本语言对服务器端的要求比较高，而对客户端的要求相对而言就比较低了。,1.1.3 什么是JavaScript,JavaScript最早是由网景公司开发出来的一种跨平台的、面向对象的脚本语言。

3、最初这种脚本语言只能在网景公司的浏览器Netscape中使用。为了抢占浏览器市场，微软在其Internet Explorer浏览器里也加入了对JavaScript的支持，从此JavaScript得到了广泛的支持。目前几乎所有的主流浏览器都支持JavaScript。,1.1.4 JavaScript与Jscript、VBScript、ECMAScript的区别,JavaScript、VBScript、Jscript和ECMAScript都是网页脚本语言，都可以在客户端浏览器中运行。这三种脚本语言是由不同公司所开发的：,1.1.5 JavaScript与Java的区别,虽然JavaScript与J

4、ava从字面上看区别不大，其实两者之间除了在语法上有些相似之外，其余地方几乎没有相同之处：,1.2 JavaScript的作用,JavaScript虽然只是一种客户端的脚本语言，但是功能却十分强大，其主要功能有以下几点：（具体内容请参照书。）,1.3 Script的版本与支持,JavaScript从1995年诞生到现在，已经发展了十余年，在此期间，网景公司发布了多个版本的JavaScript。与此同时，微软公司与ECMA也分别对其下的VBScript和JScript发布了多个版本。,1.3.1 Script的版本,下面介绍JavaScript、JScript与ECMAScript的几个版本，以

5、及这几个版本之间的差异。 1.3.1.1 JavaScript的版本 1.3.1.2 JScript的版本 1.3.1.3 ECMAScript的版本,1.3.2 浏览器对JavaScript的支持,目前在市场上使用得比较多的浏览器包括微软公司的Internet Explorer浏览器（简称为IE浏览器）、网景公司的Netscape浏览器、Opera公司的Opera浏览器、Mozilla公司的FireFox浏览器等等，都支持JavaScript。但是，不同的浏览器对JavaScript的支持都有所不同，,1.3.3 开启浏览器对JavaScript的支持,1.3.3.1 开启IE浏览器对Jav

6、aScript的支持 1.3.3.2 开启Netscape浏览器对JavaScript的支持 1.3.3.3 开启Opera浏览器对JavaScript的支持 1.3.3.4 开启Firefox浏览器对JavaScript的支持 1.3.3.5 开启IE浏览器对本地JavaScript的支持,1.4 面向对象的语言,在最初的程序设计中，所有的关系都是用变量或表达式来构成，程序员常常很难弄清楚每个变量或表达式之间的关系，直到面向对象的概念出现。JavaScript也是一种面向对象的语言。,1.4.1 面向对象介绍,所谓对象，实际上就是一个事先定义好的程序模块，在程序模块中定义好变量或表达式之间的

7、关系，程序员可以直接使用这些关系来设计自己的程序。 1.4.1.1 对象的介绍 1.4.1.2 对象的方法与属性,1.4.2 对象的操作,在JavaScript中已经预定义好了很多对象，程序员可以直接使用这些对象。对象都是使用new运算符来定义的，例如使用一个日期对象，可以使用以下语句来定义一个新的日期对象：,1.4.3 类、对象与对象实例,虽然JavaScript被称为“面向对象”的语言，但是在JavaScript中并没有正式的“类”的概念，这一点与其他面向对象的程序设计语言有所不同。简单一点说，类是指一个分类，例如汽车、动物都是一个类。而在汽车类中的卡车、公共汽车、货车等，这些都是对象。同

8、样在动物类中，猪、狗、猫等，也都是对象。,1.5 JavaScript编辑器,JavaScript是嵌入HTML中的一段程序代码，因此，只要能编辑HTML的编辑器，都可以编辑JavaScript。,1.5.1 记事本,记事本是最简单的文本编辑器，就是因为简单，除了做些简单的文字处理之外，就没有其他功能了。如果使用记事本来编辑JavaScript，需要对JavaScript的语法、对象等都比较熟悉。不过也因为记事本比较简单，打开速度快，使用方便，常常用来做局部的修改。（具体内容请参照书。）,1.5.2 1st JavaScript Editor,1st JavaScript Editor是一个很

9、好的JavaScript编辑软件，有着十分丰富的编辑功能，可以显示正确的语法代码，还有十分出色的提示功能。在输入代码时可以弹出代码提示，除了可以提高开发人员的工作效率之外，还可以减少出现错误的机会。（具体内容请参照书。）,1.5.3 Ultra Edit 32,Ultra Edit 32是由IDM Computer Solutions公司出品的著名的文本编辑器，该编辑器内置了HTML、JavaScript的语法检查，可以显示正确的JavaScript代码。Ultra Edit 32可以同时编辑多个文件，并且开启速度也很快，可以取代记事本使用。（具体内容请参照书。）,1.5.4 Dreamwea

10、ver,Macromedia公司的Dreamweaver是建立Web站点和应用程序的专业工具，该工具可以将可视化工具、应用程序开发功能与代码编辑组合在一起，并且内置了一些JavaScript小程序。在手动编辑JavaScript方面，也有代码提示，可以让程序员轻松完成代码编辑工作。（具体内容请参照书。）,1.6 在网页中加入JavaScript,JavaScript作为脚本语言，可以插入到HTML代码之中，下面介绍如何在HTML代码之中加入JavaScript。,1.6.1 使用标签,在HTML中加入Script代码，必须将Script代码放在与标签之间。如以下代码，注意加粗的文字：（具体内容

11、请参照书。）,1.6.2 简单的输出,在系统学习JavaScript之前，先介绍两个常用的JavaScript语句，这两个语句经常用来调试JavaScript程序。 1.6.2.1 输出警告框 1.6.2.2 输出文字,1.6.3 注释,与其他语言程序一样，JavaScript也可以使用注释语句来注释一行或一段代码。被注释的代码是不会被执行的，通常用于代码调试或说明。JavaScript中的注释语句两种：单行注释与多行注释。（具体内容请参照书。）,1.6.4 使用HTML的注释语句来标记JavaScript代码,虽然现在主流的浏览器都支持JavaScript，但也无法确保所有用户都在使用主流浏

12、览器。有些用户甚至还在使用不支持JavaScript的浏览器来浏览网页。此时可以利用HTML的注释语句来标记JavaScript代码，让那些老浏览器不执行这些JavaScript代码。在HTML语言里，可以使用“”来注释代码，其使用方法如下所示，,1.6.5 浏览效果,由于JavaScript是嵌在HTML中的代码，如果要浏览JavaScript的效果，只要能运行HTML文件即可。本地计算机上的HTML文件可以直接双击打开，Web上的HTML文件可以在浏览器中输入网址打开。在本书中所有的范例默认为使用微软的Internet Explorer 6浏览器打开。如果编写JavaScript代码时出现

13、错误，使用Internet Explorer浏览器打开该文件时，（具体内容请参照书。）,1.7 标记介绍,JavaScript脚本其实就是HTML文件的一部分，只是JavaScript脚本代码必须放在与标签之间。在这两个标签之间可以放置一行或多行JavaScript代码。JavaScript代码的出现次序就是JavaScript的执行次序。一个HTML文档中可以出现多个标签，但标签之间不能嵌套。,1.7.1 设置脚本语言名和版本,通过前面的章节可以知道，脚本语言分为JavaScript、VBScript、JScript、ECMAScript几种，在标签里可以通过language属性来设置使用哪

14、种脚本语言，如以下代码：（具体内容请参照书。）,1.7.2 指定脚本语言的MIME类型,在HTML 4标准里并不赞成使用language属性，而是赞成使用type属性。language属性可以用来指定使用哪种脚本语言，而type属性可以指定脚本语言的MIME类型。从理论上而言，为脚本语言指定MIME类型比指定脚本语言名称要科学得多，但是事实上各种浏览器对language属性的支持比对type属性的支持要好得多。（具体内容请参照书。）,1.7.3 defer属性,由于JavaScript脚本可以放在HTML文件的任何位置，因此，在浏览器解析HTML文档时，一旦遇到Script脚本，就会停止解析文

15、档，等待脚本的执行，只有当脚本执行完毕之后才会继续执行HTML文档的解析。,1.7.4 包括外部的JavaScript文件,JavaScript除了可以直接嵌入HTML文件中，也可以独立存在与HTML文件之外。可以通过设置标签中src属性来指定外部JavaScript文件的地址。,1.8 JavaScript的执行方式,JavaScript的功能十分强大，有些JavaScript代码可能需要立即执行，而有些JavaScript代码可能需要在触发了一些事件（如单击了按钮）之后才可以执行。,1.8.1 直接执行,在与标签中的JavaScript代码，只要不是放置在函数中的，都是属于直接执行的Jav

16、aScript代码。请看以下代码，注意加粗的文字：（具体内容请参照书。）,1.8.2 使用“javascript:”调用,在HTML里可以通过“javascript:”方式来调用JavaScript的函数或方法，请看以下代码，注意加粗的文字：（具体内容请参照书。）,1.8.3 与事件结合调用,JavaScript可以支持很多事件，所谓事件可以影响用户的操作，比如说单击鼠标左键、按下键盘、移动鼠标等等。与事件结合，可以调用执行JavaScript的方法或函数。请看以下代码，注意加粗的文字：,1.9 注意事项,JavaScript虽然比较简单，但是在编写JavaScript代码时，有以下几点是需要注意的。,1.9.1 大小写敏感,虽然HTML对大小写不敏感，但是嵌入HTML中的JavaScript对大小写却是敏感的。因此，在定义与使用JavaScript的常量、变量、函数名时，一定要保持大小写相同。例如“JavaScript”、“javascript”、“Javascript”与“JAVAscript”就是四个不同的变量名。,1.9.2 空格与换行,在JavaScript中会忽略程序中的空格、换行和制表符，除非这些符号是字符串或正则表达式中的一部分。因此可以在程序中随意使用这些特殊符号来进行排版，让代码更加易于阅读和理