文档介绍：网页设计与制作教程(第2版)
机械工业出版社同名教材配套电子教案
第6章 JavaScript脚本基础
JavaScript语言概况
JavaScript的运行环境
JavaScript程序的引入
JavaScript的基本数据结构
基本数据类型
常量
变量
表达式和运算符
JavaScript的程序构成
程序控制流程
函数
事件驱动及事件处理
基于对象的JavaScript语言
对象概念的引入
在JavaScript中使用对象
JavaScript常用内部对象
Web页面信息交互
习题6
JavaScript语言概况
JavaScript的运行环境
JavaScript程序的引入
下面通过例子说明JavaScript的脚本是怎样被嵌入到HTML文档中的。
【例6-1】在HTML文档中嵌入JavaScript的脚本。
<HTML>
<HEAD>
<Script Language="JavaScript">
("第一个JavaScript例子!")
alert("欢迎进入JavaScript世界!")
</Script>
</HEAD>
<BODY bgcolor=ivory>
<CENTER>
<FONT face=楷体 size=5 color=blue>新年好!</FONT>
</CENTER>
</BODY>
</HTML>
如图6-1所示为Web浏览器载入时的运行显示结果,如图6-2所示为单击自动弹出对话框中的“确定”按钮后的最终显示结果。从上面的例题中可以看出,在用浏览器载入HTML文件时,是从文件头向后解释并处理HTML文件的。
需要提醒的是,在<Script Language ="JavaScript">...</Script>中的程序代码有大、小写之分,()(),否则将无法得到需要的效果。
在JavaScript的程序代码中,可以插入注释语句以增加程序的可读性。注释语句有单行注释和多行注释之分。其写法如下:
// 单行注释
/* 多行注释
…
多行注释*/
JavaScript的基本数据结构
基本数据类型
JavaScript有6种数据类型。主要的类型有number、string、object以及Boolean类型,其他两种类型为null和undefined。
常量
1. 字符型常量
2. 数值型
3. 布尔型常量
4. 空值
5. 特殊字符
变量
变量用来存放程序运行过程中的临时值,这样在需要用这个值的地方就可以用变量来代表。对于变量必须明确变量的命名、变量的类型、变量的声明及其变量的作用域。
1. 变量的命名
2. 变量的类型
3. 变量的声明及其作用域
变量的声明和赋值语句var的语法为:
var 变量名称[= 初始值]
表达式和运算符
【例6-2】停留时间的计算。
<HTML>
<HEAD> </HEAD>
<BODY onUnload=stay()>
<CENTER>
<FONT face=楷体 size=5 color=blue>关闭该窗口,看看会发生什么?</FONT>
</CENTER>
<script language="Javascript">
pageOpen = new Date();
function stay() {
pageClose = new Date();
minutes = (() - ());
seconds = (() - ());
time = (seconds + (minutes * 60));
alert("您刚才在窗口中停留了" + time + "秒钟");}
</script>
</BODY>
</HTML>
如图6-3所示为Web浏览器载入时的显示,如图6-4所示为关闭窗口后弹出对话框显示出停留时间。该例中对变量minutes、seconds、time等进行了数学运算。
JavaScript的程序构成
JavaScript脚本程序是由控制语句、函数、对象、方法、属性等组成的。JavaScript所提供的语句分为以下几大