javascript 程序设计
DESCRIPTION
JavaScript 程序设计. 第1章 JavaScript 语言概论. 1.1 JavaScript 语言概况 1.2 在 Web 页面中使用 JavaScript 1.3 编写 JavaScript 的工具 1.4 第一个 JavaScript 程序. 1.1.1 JavaScript 语言. - PowerPoint PPT PresentationTRANSCRIPT
JavaScript 程序设计
第 1 章 JavaScript 语言概论
1.1 JavaScript 语言概况 1.2 在 Web 页面中使用 JavaScript 1.3 编写 JavaScript 的工具 1.4 第一个 JavaScript 程序
1.1.1 JavaScript 语言
JavaScript 是一种基于对象（ Object ）和事件驱动（ Event Driven ）并具有安全性能的脚本语言。使用它的目的是与 HTML 超文本标记语言、 Java 小程序一起实现在一个 Web 页面中连接多个对象，与 Web 客户交互作用，从而可以开发客户端的应用程序 。
1.1.2 JavaScript 可以做什么 制作网页特效
例如：光标动画、信息提示、动态广告面板、检测鼠标行为等。
提升使用性能 越是复杂的代码，越要耗费系统资源来执行它，因为大
部分的 JavaScript 程序代码都在客户端执行，操作时完全不用服务器操心，这样，网页服务器就可以将资源用在提供客户端更多更好的服务上。
窗口动态操作 利用 JavaScript ，可以很自由地设计网页窗口的大小、
窗口的打开与关闭等，甚至也可以在不同窗口文件中互相传递参数。
1.1.3 JavaScript 和 Java 的比较
基于对象和面向对象 Java 是一种真正的面向对象的语言，即使是开发简单的
程序，也必须设计对象。 JavaScript 是种脚本语言，它可以用来制作与网络无关的，与用户交互作用的复杂软件。它是一种基于对象和事件驱动的编程语言。
解释和编译 Java 的源代码在传递到客户端执行之前，必须经过编
译， JavaScript 是一种解释性编程语言，其源代码在发往客户端执行之前不需经过编译，而是将文本格式的字符代码发送给客户端由浏览器解释执行。
强变量和弱变量。 Java 采用强类型变量，即所有变量在编译之前
必须作声明。 JavaScript 中变量声明，采用弱类型。即变量在使用前不需作声明，而是解释器在运行时检查其数据类型，。
代码格式不一样。嵌入方式不一样。
JavaScript 使用 <Script> 和 </Script> 来标识，而 Java 使用 <applet> 和 </applet> 来标识。
1.1.4 JavaScript 的执行平台
Navigator IE 几乎所有的浏览器
1.2 在 Web 页面中使用JavaScript
JavaScript 是内嵌在 HTML 中被执行的 在 HTML 中通过标记 <SCRIPT>……</
SCRIPT> 引入 JavaScript 代码，当浏览器读取到 <SCRIPT> 标记时，就解释执行其中的脚本。
链接 JavaScript 文件
如果脚本程序较长或者同一段脚本可以在若干个 Web 页中使用，则可以将脚本放在单独的一个 .js 文件里，然后链接到需要它的HTML 文件，这相当于将其中的脚本填入链接处。
要引用外部脚本文件，使用 <SCRIPT> 标记的 SRC 属性来指定外部脚本文件的URL 。
1.3 编写 JavaScript 的工具
使用纯文本编辑器 使用专业化脚本编辑工具 ，如 Frontpage 、
Dreamweaver 等。使用 Microsoft 脚本编辑器 ， FrontPage 。
1.4 第一个 JavaScript 程序
1.4.1 关于 <SCRIPT> 标签 HTML 文档中组成 Javascript 程序的语句包含在
<SCRIPT> …</SCRIPT> 标签对中 <SCRIPT> 标签用来通知 Web 浏览器随后的指令
由脚本引擎来解释。 <SCRIPT> 标签的LANGUAGE 属性告诉浏览器使用的是哪种脚本语言和脚本语言的版本。
1.4.2 创建 JavaScript 源代码文件
JavaScript 源代码文件通常使用 .js 扩展文件名命名，其中仅包含有 JavaScript 语句，它不包含HTML 中的 <SCRIRT>……</SCRIRT> 标签对。
<SCRIRT>……</SCRIRT> 标签对位于 HTML 文档中调用源代码文件的位置。
下面的语句说明了如何装载位于 C:\java目录下名为 test1.js 的 JavaScript 源代码文件。源程序如下：
<SCRIPT LANGUAGE=”JavaScript1.2”
SRC=”C:\java\test1.js”>
</SCRIPT>
1.4.3 为 JavaScript 程序添加注释
JavaScript支持两种类型的注释：行注释和块注释。
行注释是通过在想要用作注释的文本前加上“ //” 符号来创建。
块注释可以跨越多行，通过在块中第一行前添加“ /*” 创建，在块中文本的最后加入“ */” 来表示结束注释，那么位于“ /*” 和“ */” 之间的部份将被 JavaScript 解释器忽略。
1.4.4 在不兼容的创览器中隐藏 JavaScript 代码 创建 JavaScript 源代码文件可以在不兼容的浏览
器中把 JavaScript 代码隐藏起来。为了在不兼容的浏览器中隐藏嵌入的 JavaScript 代码，就需要把 <SCRIPT>……</SCRIPT> 标签对置于一个HTML注释块中。
HTML注释以 <!-- 开始，以 -->结束。所有位于注释起始标签和结束标签之间的文本都不会被浏览器提交。
1.4.5 在 <HEAD> 或 <BODY> 段放置JavaScript
JavaScript 可以置于这两段中或者两段之间。 当把 JavaScript 代码放在 <HEAD> 段中时，它会
在被显示的 HTML 文档主体之前处理。 如果 JavaScript 代码用于完成所需的后台任务，最好将代码置于 <HEAD> 段中，如果用于显示内容，就置于 <BODY> 中。
第 2 章 JavaScript 代码编写与调试
2.1 JavaScript 代码的编写和执行 2.2 语法规则 2.3 动态生成页面内容
2.1 JavaScript 代码的编写和执行
JavaScript 是一种脚本语言，脚本语言是指在Web 浏览器内由解释解释执行的编程语言。
每次执行的时候解释器都会把程序代码翻译成可执行的格式。
2.2 语法规则
2.2.1 大小写 JavaScript 是大小写敏感的，这意味着大写字母同
相应的小写字母是不同的。 适用于该语言的各个方面，包括关键字、运算符、
变量名、事件处理器、对象属性等； 所有的关键字都要小写，如 if ，不能键入 IF； 使用“驼峰”命名的传统，许多方法和属性使用混合大小写。
2.2.2 代码书写格式
将 JavaScript 的程序代码放在 <SCRIPT>…</SCRIPT> 对中。 <script> document.write(“Hello world!!!”); </script>
在 <SCRIPT> 标记中加上 Language 属性，指定使用哪一种语言。
<script language=“JavaScript”> document.write(“Hello world!!!”); </script>
在标记 Language 属性外再进一步指明 JavaScript的版本号。
<script language=“JavaScript1.2” >
document.write(“Hello world!!!”);
</script> 可以将可能重复使用的程序代码独立成一个外部文
件，只要以 .js 为扩展名，利用 SRC 属性就可以将该文件的内容 include进来。
为了避免客户端使用比较旧的浏览器，可以将所有的程序代码用 HTML 的注释标记括起来 。
<script language=“JavaScript”> <!-- 以下程序隐藏起来，让旧的浏览器视而不见
document.write(“Hello world!!!”); // 程序代码隐藏到此为止 --> </script>
2.2.3 保留字
break case catch continue debugger
default delete do else false
finally for function if in
instanceof new null return switch
this throw true try typeof
var void while with
2.2.4 分号和语句结束符
JavaScript 语句以分号“ ；”作为结束符 。
2.3 动态生成页面内容
2.3.1 字符串及其拼接方法所谓的“字符串常量”是由一些包含在单引号或双引号内的字符所构成的。
转义字符
JavaScript 的转义字符
字符 意义\b 后退一格\f 换页\n 换行\r 返回\t 制表\’ 单引号\” 双引号\\ 反斜线
2.3.2 document 对象 write() 和 writeln() 方法
JavaScript 的信息输出方法：window.alert() 、 document.write() 和document.writeln()
document 是 JavaScript 中的一个对象，在它里面封装了许多很多有用的方法， write() 和 writeln()
是用于将文本信息直接输出到浏览器窗口中的方法。
第 3 章 与用户交互方法
3.1 消息对话框
一种特殊的窗口，在用户进行触发操作后自动弹出，起到提醒、警告或确认的作用。
作用：在浏览网页时对用户进行提示，警告某种操作可能造成的后果或确认是否进行某项操作。
JavaScript支持的消息对话框
警告对话框确认对话框提示对话框
显示警告对话框的 alert() 方法
alert( ) 方法的标准语法是： window. alert("content");
或者简化为： alert("content");
“content” 为警告对话框中显示的文本内容，它的变量类型是字符类型。
显示确认消息框的 confirm() 方法
confirm( ) 方法的标准语法是： window.confirm("content");
或者简化为： confirm("content");
“content” 是提示对话框的显示文本。confirm( ) 方法返回一个布尔型的值，当用户点击“确认”时返回“ true”值，否则返回“ false”值。
显示提示对话框的 prompt( ) 方法
prompt( ) 方法的基本语法如下：result=window.prompt(prompt content,
default content);
prompt( ) 方法有两个参数，第一个是提示文本 prompt content; 第二个是放置在文本框中的默认提示文本 default content ，通常可以省略第二个参数
第 4 章 变量、数据类型和表达式
4.1 变量的概念
变量使用 var 关键字进行变量的声明： var x;
变量初始化 在声明的时候可以同时对变量进行初始化： var y=4;
如果使用同时声明多个变量的时候，可以使用逗号将多个变量隔开：
var x,y=5,z='hello';
变量在不同时刻可以被赋予不同的值； 使用没有声明的变量将出现错误。
4.1.2 变量的命名
变量是一种标识符；JavaScript 有 3 种标识符：变量、函数和标
签。标识符区分大小写。创建合法的变量必须满足几个规则：
第一个字符是 ASCII 字母（大小写皆可），或者是下划线。但是不可以是数字。
变量必须由字母、数字和下划线组成。变量不可以是保留字。
4.1.3 变量的作用域
变量的作用域：变量发生作用的范围，变量在声明后，只在自己的作用域中有效，在作用域外使用变量将导致编译器报错。
例： var x;
function FirstFunction()
{
var y;
}
x=y;//错误，在变量 y 的作用域外使用变量 y
4.2 数据类型
4.2.1 数据类型字符串、数值和布尔型是 JavaScript 的三
种基本数据类型数组和对象是复合数据类型。
4.2.2 字符串型
一个字符串值是排在一起的一串字母、数字和标点符号，简单的说字符串就是文本。
字符串中的字母、数字和标点符号放在一对匹配的单引号或双引号中。
例： var x='Welcome to China.'
var y="Welcome to China——2008."
字符串中可以包含单引号，该单引号两边需加双引号，字符串中也可以包含双引号，该双引号两边需加单号。
例： var x= " 'Welcome to China. ' "
var y=' "Welcome to China——2008. " ‘
如果要输出特殊字符，需使用转义字符
4.2.3 数值型
JavaScript 的数值型分整数型和浮点型两种。整数型是不带小数点的，可以是 10 进制数、 8 进
制数或 16进制数。 JavaScript 有三个特殊的数值 ：正无穷大、负无穷
大和 NaN（不是数）
4.2.4 布尔型
布尔数据类型表示一个状态的有效性，只有两个值 true ：布尔类型变量的值为 true说明该状态是成立的（真）
false ：值为 false说明该状态是不成立的（假）。 例： y=(x==2009);
两种特殊的数据类型
第一种是 null ， null 的意思是空值或者是不存在的值。
另一种是 undefined ， undefined 类型的变量是没有被赋值或者无法被赋值的。
4.2.5 数组
数组代表了一组被排列的变量，这些变量被称作元素。
数组中单个元素的定位是从 0 开始的，这是数组的一个特性。
由于数组中的元素是相互独立的，意味着相同数组中的不同元素可以拥有不同的数据类型。
数组的初始化
声明数组的时候，用一列在方括号内被逗号隔开的值表示 ：
var fisrtArray=[524,65,14.2,”forteen”,NULL,TURE];
先定义一个空的数组 ，以后再赋值： var array=[ ];
array[3]="This is the last element in the array";
JavaScript 中，数组属于 Array 对象，也可这样声明 var arr=new Array();
4.3 数据类型转换
当改变存储在变量中的值时，可能会自动产生数据类型的转换，这种操作的好处是能将变量作为另一类型处理 。
例： var x="15"; //x 是字符串型变量 x=15; // 自动将 x转换为数值型变量
4.4 表达式和运算符
4.4.1 表达式表达式是解释器能够对变量进行计算的式子，表达
式主要由任何合法类型的变量和运算符组成。 例： var x=4;
x=x+4;
var y=x;
y=y+6;
分号代表一个语句的结束； 使用分号可以在同一行中包括多个语句； var x=4; x=x+4; var y=x; y=y+6; 有些时候，分号可以省略 var x=4
x=x+4
var y=x
y=y+6
4.4.2 算术运算符和赋值运算符
JavaScript支持所有数学中的算术运算符，加（ +）、减（ -）、乘（ *）、除（ /）、 %^（模运算符）、 ++（递加运算符）、 --（递减运算符）。
当“ +”两边的变量是字符串时， “ +” 做连接操作， “ +” 也允许连接变量和字符串。
赋值运算符“ =” 的作用是将某个值赋给一个变量。
赋值时可以一对一，也可以一次赋值多个；例： var x=“welcome”;
var a=b=c=7;
4.4.3 比较运算符和逻辑运算符
符号 含义 举例 结果== 等于 3-1==2 True
!= 不等于 2+1!=2 True
>= 大于等于 2+1>=3 True
<= 小于等于 2+1<=3 True
> 大于 2+1>3 False
< 小于 2+1<3 False
=== 等于 ( 同一类型 ) 2+1===‘2+1’ False
!== 不等于 ( 同一类型 )
2+1!==‘3’ True
逻辑运算符
符号 名称 含义
! 逻辑非 如果操作数是 true ，则返回false ，反之亦然
&& 逻辑与 如果两个操作数都是 true ，则返回 true ，否则返回 false
|| 逻辑或 两个操作数中任何一个是 true ，则返回 true ，否则返回 false
条件运算符是 JavaScript 中唯一的一个三元运算符。条件运算符用符号” ? ;”表示，使用方法为：
a?b:c
a ， b 和 c 是三个表达式。当表达式 a 成立的时候，取表达式 b 的值，否则取表达式 c的值。
4.4.5 其他运算符
逗号运算符 将多个语句捆绑在一起按照一个语句的执行方
式执行；使用逗号运算符捆绑在一起的语句返回最后一
个语句的值。
typeof 运算符 返回一个表达式的数据类型的字符串；有 6 种可能的返回值，“ number” 、“ string” 、 “ boolean ” 、 “ object ” 、 “ function” 、“ undefined” 。
空运算符 void 定义了没有任何返回值的表达式。
使用最多的地方是在使用超链接时，为了避免加载无效的页面并且不希望超链接文本被单击时不产生任何操作，可利用如下空运算符
<a href=“javascript:void(alert(‘ 本链接无效！’ ))”>超链接 </a>
第 5 章 JavaScript 控制语句
5.1 条件控制语句
JavaScript 使用控制语句控制程序的执行顺序。使之能够不按照编写的先后顺序执行。
JavaScript支持两种控制语句，分别是： 1 、条件控制语句
2 、循环控制语句。
条件控制语句
条件控制语句使用逻辑方式判断语句的执行顺序，判断条件通常是一个表达式，如果表达式的值为“真”，将采用一种执行方式，如果表达式的值为“假”，将采用另外一种不同的执行方式。
JavaScript支持三种条件控制语句，分别是if 语句、 if…else 语句和 switch 语句。
5.1.1 if 语句 If 语句是一种单一选择的语句，基本的语法规则如下：
if (expression) Statement;
expression 是一个条件表达式，这个表达式如果成立将返回结果“ true” ，否则将返回结果“ false” 。但是，当且仅当 expression返回“ true” 时，代码 Statement才会被执行。否则Statement 将不会被执行。
如果需要执行多行代码，可以使用块： if (expression)
｛ Statement1;
Statement2;
｝
5.1.2 if...else 语句 if ...else 语句是两重选择语句，基本语法规则如下：
if (condition) statement1; else statement2; 当 if 中的条件满足时，将执行 statement1 ，否
则将执行 statement2 。也就是说，在 statement1和 statement2 中，必然有一个会被执行，并且只有一个能够被执行。
将 Statement1 和 Statement2 放在大括号内是一个好习惯，可以使程序结构清晰，有较高的可读性。
if (condition)
{statement1;}
else
{statement2;}
5.1.3 switch 语句 switch 语句的语法结构是定义一个条件表达式，然后一个个地检查是否能够找到匹配值。如果无法找到匹配值，就执行 default条件。 switch (expression)
{
case condition 1: statement 1; break;
case condition 2: statement 2; break;
...
case condition n-1: statement n-1; break;
default: statement n;
}
5.1.4 条件运算符
条件运算符有时也可以作为条件控制语句出现
var x=45;
alert(x%2==0?”x 是一个偶数” :”x 是一个奇数” )
5.2 循环语句 循环控制语句的出现是为了能多次执行某些语句。
在使用循环控制语句时，对循环条件的控制和对循环次数的控制是两个十分重要的要素。
JavaScript支持四种循环控制语句， while语句、 do…while 语句、 for 语句、 for……in 语句。
5.2.1 while 语句
while 语句的基本语法为： while(expression)
{
statement(s);
}
expression 是一个表达式，只要表达式的值为true ，则将反复执行大括号中的内容，直到expression 的值为 false 为止。
5.2.2 do...while 语句
do…while 语句和 while 语句的功能是类似的，除了while 语句对执行条件的核查是在执行循环语句前， do…while 语句对执行条件的核查是在执行了循环语句后。
do…while 语句的基本语句结构如下：do{
statement(s);
}
while(expression);
5.2.3 for 语句 for 语句的基本语句规则如下：
for(count;testCondition;updateOperation) { statement(s); } 例： var i=0,sum=0; for(i=0;i<=5;i++) sum=sum+i; document.write(“the sum from 1 to 5 is:”+sum”);
5.3 与对象有关的语句
5.3.1 for...in 语句 for…in 语句是一种对象循环语句，用来对某个对
象的不同属性进行循环。 for…in 语句的基本语法结构如下：
for(properties in object)
{
statement(s);
}
var obj = new Object();obj.name=“Kate”;obj.sex=“ 男” ;for(prop in obj) window.alert(obj[prop]);
5.3.2 with 语句
with 语句是一种简便地引用对象方法。当一个对象的多个属性同时被引用的时候， with 语句可以避免多次输入对象名。
with 语句的基本语法规则如下： with(object)
{
statement(s);
}
5.3.2 with 语句 <body> <script type="text/javascript"> <!— with(document){ write(" 您好 !"); write("<br> 这个文档的标题是 : \"" + title + "\"."); write("<br> 这个文档的 URL 是 : " + URL); write("<br> 现在不用每次都写 document 对象的前缀了 !"); } // --> </script> </body>
5.4 循环控制
JavaScript 有两种循环控制语句：break 语句continue 语句。
第 6 章 JavaScript函数
6.1 什么是函数
JavaScript 的函数是结构化的可重用的代码块。
函数的使用方式也是多种多样。
6.2 定义函数和使用函数 JavaScript 支持两种函数：一类是内部函数，另一类是自
定义函数。 定义函数最常用的方法是使用关键字 function ，关键字后
是函数名、列在括号中的参数列表和使用大括号围起来的语句块。
定义函数的基本语法结构如下：function
functionName(parameter1,parameter2,...parameterN){
statement(s);}
函数参数
函数参数用于给函数传递信息，参数被放在函数名称后面的圆括号中。
函数参数不是函数的必选内容，某些函数根本不带任何参数，或者带一个或者多个参数，参数的个数取决于如何使用该函数。
如果在调用一个需要参数的函数时没有传递参数， JavaScript 使用空值代替。
内部函数
JavaScript 本身定义了丰富的内部函数，充分地利用这些内部函数可以使编写脚本相对简单。
两个例子： eval( ) 函数 ：可以对字符串形式表示的任意有效
的 JavaScript表达式求值；有一个参数，该参数就是想求值的字符串表达式。
toString( ) 函数：返回对象的字符串表示。
6.3 函数参数的传递
参数是按值传递的，也就是说，当某个变量作为参数被传递给一个函数的时候，实际上函数得到的只是这个变量值的一个副本。
当参数是复合数据类型即数组或者对象时，是传递参数的一个引用。
6.4 在多个位置调用函数
在事件响应中调用函数 鼠标点击事件 onclick 网页加载事件 onload通过链接调用函数
href=“javascript:fun()” 文本超链接 图形超链接
6.5 函数中变量的作用域
根据是否在函数体的内部，变量被分为全局变量和局部变量两种。
全局变量是在整个文档中都是可见的。局部变量只在函数体内部可见。
函数的返回值
如果需要得到函数的计算结果，最好的方法是使用返回值。
返回值使用 return 语句实现。
6.6 递归函数
递归是函数调用自身的一种形式。 递归函数实际上也是一种特殊的循环，只是循环体不是一个变量，而是函数本身。
函数的嵌套
这里函数的嵌套指的是在函数体内部定义函数。
和局部变量具有相同的特点是，在嵌套函数外部调用内部函数，就会产生错误。
当被嵌套的内部函数和外部函数相同是，就成为了函数嵌套的特殊形式——递归。
第 7 章 JavaScript 对象编程
7.1 对象的基本概念
对象是由数据和与该数据相关的操作组成的一个整体。
其中，这些数据代表的是对象的属性，而该数据相关的操作是对象的方法。
7.1.1 JavaScript 中的对象分类 内部对象
包括基本数据类型有关的对象、复合数据类型相关的对象和其他一些对象。
文本对象 文本 (document) 对象是文档对象模型 (DOM) 的一部分，利用文本
对象生成结构化的 HTML 和 XML 文档，并控制级联样式表和实现动态 DHTML 。
浏览器对象 浏览器支持的对象，主要浏览器对象包括 window 和 Navigator
自定义对象 用户定义的对象，用于完成用户特定的任务。
7.1.2 创建和删除对象
使用 new 关键字可以创建一个对象。创建的对象的性质由 new 关键字后的特定对象类型决定的，例如 String（）创建一个 String 对象， Array（）创建一个 Array 对象。
当创建对象的时候， JavaScript 解释器自动给对象分配内存空间，在删除对象后，解释器将自动将分配给被删除的对象收回。这种机制成为内存回收。
7.1.3 对象的属性和方法
JavaScript 对象是属性和方法的集合。 属性是一个或者一组值，是对象的成员之
一，方法是对象的一个函数，也是对象的成员。
对象属性
对象的属性使用跟在对象后面的标识符表示，对象和标识符之间用“ .” 分隔，下面是对象属性的标准表示规则：
object.propertyobject 是对象名， property 是属性名。 在定义了一个对象后，可以动态地给对象添加
属性。
对象方法
对象的方法也通过跟在对象后面的标识符表示，对象和标识符之间用“ .” 分隔，不同的是，对象的方法名后面有一对括号。下面是对象属性的标准表示规则：
object.method();object 是对象名， method 是方法名。
7.2 Math 对象
Math 对象具有一系列的常量和方法，能够实现比较复杂的算术运算逻辑。
Math 对象是由解释器自动生成的，因此在使用的时候不需要首先生成实例，而是可以直接访问。
Math 对象的属性列表
属性名 功能描述E 返回常数 e
LN2 返回 2 的自然对数LN10 返回 10 的自然对数LOG2E 返回以 2 为底的 e 的对数LOG10E 返回以 10 为底的 e 的对数PI 返回圆周率SQRT1_2 返回 1/2 的平方根SQRT2 返回 2 的平方根
Math 的对象列表
方法名 功能描述abs(x) 返回 x 的绝对值cos(x) 返回 x 的余弦值acos(x) 返回 x 的反余弦值，用弧度表示sin(x) 返回 x 的正弦值asin(x) 返回 x 的反正弦值tan(x) 返回 x 的正切值atan(x) 返回 x 的反正切值atan2(x) 返回复平面内点 (x,y) 对应的复数的幅角ceil(x) 返回大于等于 x 的最小整数
exp(x) 返回 e 的 x次幂floor(x) 返回小于等于 x 的最大整数log(x) 返回 x 的自然对数max(a,b) 返回 a,b 中较大的值min(a,b) 返回 a,b 中较小的值pow(n,m) 返回 n 的 m次幂random() 返回大于 0 小于 1 的一个随机数round(x) 返回 x四舍五入的值sqrt(x) 返回 x 的平方根
7.4 Date 对象
Date 对象提供了十分灵活的操作时间和日期的方法。
Date 对象拥有一系列属性和方法，可以用来表示任意的日期和时间，获取系统当前时间或者获取两个时间的间隔。
Date 对象是从 1970 年 1 月 1 日 00:00:00.000 GMT 开始计时的，并且以毫秒为单位。 GMT 是格林威治标准时间。
Date 对象的主要方法
第一个 Date 对象的方法是 Date 对象构造器Date()；
不仅能够生成当前时刻的 Date 对象，还能生成过去或者未来时刻的 Date 对象。
getDay() 和 setDay() 方法将星期数用 0 到 6的整数形式表示。
另一个重要的方法 Date.parse() 方法；将各种日期类型的 Date 对象转换为该日期
与 1970年 1月 1日 00:00:00 之间所间隔的毫秒数。
Date 对象常用方法列表
方法名 功能描述setFullYear() 设置用四位数表示的年份getFullYear() 返回用四位数表示的年份setYear () 设置用两位数表示的年份getYear () 返回用两位数表示的年份setMonth () 设置月份getMonth () 返回月份setDate () 设置日期getDate () 返回日期
setDay() 设置用数字表示的星期 ,0表示星期天
getDay () 返回用数字表示的星期 ,0表示星期天
setHours () 设置 24 小时制的小时数getHours () 返回 24 小时制的小时数setMinutes () 设置分钟数getMinutes () 返回分钟数setSeconds () 设置秒钟数getSeconds () 返回秒钟数setMilliseconds () 设置毫秒数
getMilliseconds () 返回毫秒数setTime () 设置时间getTime () 返回时间getTimezoneOffset () 返回日期对象采用的时区与格林威治时间所差的
分钟数toString () 返回描述时间的字符串toLocalString () 返回用本地时间格式表示的描述时间的字符串toGMTString() 返回用 GMT 格式表示的描述日期对象所指的日期
的字符串toUTCString() 返回用 UTC 格式表示的描述日期对象所指的日期
的字符串parse() 返回该日期对象的内部表达方式
创建 Date 对象
参数类型 功能
none 生成客户机当前时间
“month dd,yyyy hh:mm:ss” 生成指定月份、日期、小时、分钟和秒钟表示的时间
milliseconds 生成和 1970年 1月 1日 00:00:00间隔的毫秒数的时间
yyyy,mm,dd 生成年份、月份和日期表示的时间
yyyy,mm,dd,hh,mm,ss 生成年份、月份、日期、小时、分钟、秒钟表示的时间
yyyy,mm,dd,hh,mm,ss,ms 生成年份、月份、日期、小时、分钟、秒钟、毫秒表示的时间
7.4 Number 对象
Number 对象是提供基本数据类型中数值型的JavaScript 内置对象， Number 对象还提供数值型常数。
需要注意是，浮点类型的对象是要求介于 ±5×10-324 和 ±1.7976×10308 之间的。
构造 Number 对象的方法构造一个空的 Number 对象。不为其指定值；构造 Number 对象的时候赋给初始值。
Number 对象属性列表
属性名 功能描述
MAX_VALUE 返回 JavaScript支持的数值的最大值
MIN_VALUE 返回 Javascript支持的数值的最小值
NAN 返回“ NaN”
NEGATIVE_INFINITY 返回正无穷大
POSITIVE_INFINITY 返回负无穷大
7.5 String 对象
String 对象是提供基本数据类型中字符串型的JavaScript 内置对象。 String 对象提供的方法十分丰富。
构造 String 对象的方法构造一个空的 String 对象。不为其指定值；构造 String 对象的时候赋给初始值。
String 对象的惟一属性是长度属性，这个属性指出了 String 对象代表的字符串的长度 。
String 对象的方法列表方法名 功能描述charAt() 返回该字符串位于指定位置的单个字符charCodeAt () 返回该字符串位于指定位置的单个字符的 ASCII 码fromCharCode () 返回一个字符串，该字符串每个字符的 ASCII 码由该方法的参
数来确定宁indexOf () 返回一个字符串中第一次出现参数字符或字符串时所在位置的
索引值lastIndexOf () 返回一个字符串中最后一次出现参数字符或字符串时所在位置
的索引值split () 返回一个数组，将一个字符串根据参数隔开作为数组参数substring () 返回字符串中，由方法参数决定起始和结尾的子字符串substr () 返回字符串中，由方法参数决定起始和长度的子字符串toLowerCase () 将原字符串的所有字符转变为小写字符toUpperCase () 将原字符串的所有字符转变为大写字符concat () 返回包含了两个或更多个提供的字符串的连接的字符串值
7.6 Array 对象
当创建一个数组时，实际上创建了一个 Array 对象。 定义一个 Array 对象的方法
var firstArray=new Array();
firstArray[3] =[“red”,”green”,”blue”]; var secondArray=new Array
(“white”,”black”,”yellow”,”orange”); var thirdArray=new Array(3);
thirdArray[0]= “red”;
thirdArray[1]=“green”;
thirdArray[2]=“blue”;
Array 对象的常用属性和方法
Array 对象一个非常重要的属性 length 是其长度属性。
Array 对象的长度属性返回数组中现有的元素个数。
由于 Array 对象索引值从 0 开始的缘故，长度属性返回的值也是 Array 对象下一次动态增加元素的索引值。
例 var
week=[“Sunday”,“Monday”,“Tuesday”,“Wed
nesday”,“Thursday”,“Friday”,“Saturday”];
alert(week.length);
当动态地增加或删除数组中的元素时，数组的长度属性也会相应的变化。
Array 对象的方法列表方法名 功能描述join () 返回一个字符串，该字符串把数组中的各个元素串
起来，用分隔符隔开reverse () 返回一个数组，结果数组和原数组中的元素的顺序
相反slice () 返回一个数组，该数组是原数组的子集sort () 使数组中的元素按照一定顺序排列pop () 返回数组的最后一个元素，并删除这个元素，将数
组的长度属性值减 1
push () 将给定的参数加到数组的后面，同时将数组的长度属性加 1
shift () 删除数组的第一个元素，并将其他元素的索引值和数组长度属性减 1
unshift() 在数组前端依次插入参数表示的值，相应增加其他的元素的索引值，并调整数组的长度属性。
第 8 章 文档对象模型和事件驱动
8.1 文档对象模型 8.2 事件驱动 8.3 处理事件 8.4 使用事件 (Event) 对象
8.1.1 文档对象模型
文档对象 DOM 是指在网页文档里划分出来的对象。
在 JavaScript 能够涉及的范围内有如下对象：window 、 document 、 location 、 navigator 、 screen 、 history 。
要引用某个对象，就要把父级的对象都列出来。
window
screen
navigator
location
history
frame
event
document
link
image
form
embed
area
applet
anchor
link
image
radio
password
option
hidden
fileUpload
checkbox
button
submit
reset
textarea
text
文档对象模型
8.1.2 引用文档对象模型中的对象
在文档对象模型的层次结构中，所有下层对象都是其上层对象的子对象。而子对象其实就是父对象的属性，所以引用子对象的方式，与引用对象的一般属性是相同的。
例如引用 document 对象，使用以下的类似格式： window.document.write("Hello");
http://www.google.com
window 窗口对象window 窗口对象
location地址对象location地址对象
FORM表单对象FORM表单对象
浏览器对象的分层结构浏览器对象的分层结构
window.document.myform.text1 window.document.myform.text1
document文档对象document文档对象
浏览器对象的分层结构
8.2.1 事件驱动的基本概念
通常鼠标或热键的动作我们称之为事件（ Event）；
由鼠标或热键引发的一连串程序的动作，称之为事件驱动（ Event Driver）；
对事件进行处理的程序或函数，称为事件处理程序（ Event Handler）
8.2.2 JavaScript 的常用事件
事件名称 适用对象 意义 说明
Abort image 中止当图像尚未完全加载，用户就单击了一个超级链接，或单击停止按钮
BlurWindow及所有表单子组件
失去焦点 用户将他的输入焦点从窗口或表单移开
ChangeText,password,textarea,select 改变 用户改变组件的值
ClickLink及所有表单子组件
单击鼠标一下 用户在上述对象上单击一下鼠标左键
DblClickLink及所有表单子组件
双击鼠标 用户在上述对象上双击鼠标
DrogDrop window 拖拽 用户用鼠标左键将对象拖拽至窗口内
Error Image ， window 错误 加载文件或图形时发生错误
FocusWindow及所有表单子组件
取得焦点 用户将输入焦点放进上述对象
KeyDownImage,link及所有表单子组件
按下键盘上任意键
用户按下键盘上某个键的一刹那
KeyPressImage,link及所有表单子组件
按下键盘上任意键
用户按下键盘上某个键时
KeyUpImage,link及所有表单子组件
键盘上任意键弹起来
用户按下键盘上某个键后，按键弹起来的一刹那
Load Document 加载 浏览器读入该文件时
MouseDowndocument,link及所有表单子组件
单击鼠标 用户单击鼠标时
MouseMovedocument,link及所有表单子组件
移动鼠标 用户移动鼠标光标时
MouseOverdocument,link及所有表单子组件
鼠标进入 用户将鼠标光标移动到上述对象时
MouseOutdocument,link及所有表单子组件
移开鼠标 用户将鼠标光标离开到上述对象时
MouseUpdocument,link及所有表单子组件
放开鼠标左键
用户将鼠标左键放开时
Move Window 移动 用户或程序移动窗口时
Reset Form 重来一次 用户点击表单中的 reset
按钮
Resize Window 改变大小 用户调整窗口大小尺寸
Select Text,password,textarea 选择 用户选取上述对象
Submit Form 送出 用户单击表单中的Submit按钮
Upload document 退出 用户关闭或退出目前网页
如果 HTML 标记或程序为某个对象设置了事件处理程序，系统会自动捕捉发生在此对象上的这种事件，并触发所定义的事件处理程序。
8.3.1 使用事件的方法
前面所提到的二十多种事件，每一种事件都有一个专用的事件处理过程定义方式 ——在前面加上 on 就是了。
例如：事件 Load 的事件处理程序就是onLoad; 同样地，事件 Click 的事件处理程序就是 onClick 。
常见的事件处理方法
单击事件 onClickonChange改变事件载入文件 onLoad错误处理 onErroronMouseOver 和 onMouseOut
第 9 章 窗口、文档和表单对象
9.1 窗口 (Window) 对象 9.2 文档 (document) 对象 9.3 表单 (form) 对象
9.1 窗口 (Window) 对象
9.1.1 window 对象的属性和方法 Window 对象处于对象层次的顶端，提供了处理浏览器窗
口的方法和属性； Window 对象的使用，主要集中在四个方面：
窗口的打开和关闭； 窗口状态的设置； 定时执行程序； 各种对话框的使用。
9.1.2 打开和关闭窗口
通过脚本可以打开新窗口，也可以关闭窗口。 打开新窗口的语法如下：
open(URL,[ 窗口名称 [ ，规格参数 ]]) 第一个参数是 URL ，这个部份可以是完整的网址（如： http://www.baidu.com/） , 代表打开该网址主页；也可以是相对路径表示的文件名称（如：login.htm），代表打开该文件。如果 URL 是一个空字符串，将新增一个空白窗口（没有任何内容）。
第二个参数是窗口名称，可以搭配 HTML 语法中的 FORM及 A 标记下的 TARGET 属性来使用。
第三个参数是由许多由逗号隔开的参数字符所组成，统称规格参数。用以制定新窗口的外观及属性。
9.1.3 使用定时器
定时器可以指定在某一段特定时间后执行某段程序。在 Internet的应用中，这是非常有用的。
方法 说明
setTimeout（表达式，时间）
激活定时器，当时间参数所设置的时间到达时，执行表达式
clearTimeout 停止 setTimeout 方法激活的定时器
setInterval （表达式，时间）
激活定时器，按时间参数所设置的时间周期地执行表达式
clearInterval 停止 setIntervalt 方法激活的定时器
9.1.4 页面跳转
所谓的页面跳转，就是指从当前这一页面链接到另一个页面，在 HTML 文档中，可以通过脚本控制窗口显示特定的页面。
window.location.href="index.jsp"; window.history.back(-1);
window.navigate("index.jsp");
self.location.href=index.htm; top.location=index.jsp;
<SCRIPT language="javascript">function openwindow( ) { window.status=" 系统当前状态：您正在注册用户 ......"; if (window.screen.width == 1024 && window.screen.height == 768) window.open("register.html"); else window.alert(" 请设置分辨率为 1024x768 ，然后再打开 "); }function closewindow( ){ if(window.confirm(" 您确认要退出系统吗？ ")) window.close( ); }</SCRIPT><INPUT type="button" name="regButton" value=" 用户注册 " onclick="openwindow( )"><INPUT type="button" name="exitButton" value=" 退 出 " onclick="closewindow( )">
在窗口状态栏中设置文本在窗口状态栏中设置文本
设置窗口的高度设置窗口的高度使用 open 方
法打开新窗口使用 open 方法打开新窗口
弹出警告对话框弹出警告对话框
弹出确认对话框弹出确认对话框关闭当前窗口关闭当前窗口添加单
击事件添加单击事件因为 window 是最顶层的根，所以可以省略
window.open("google.htm");可简写为：open("google.htm");close( ) 方法也是如此。
因为 window 是最顶层的根，所以可以省略window.open("google.htm");可简写为：open("google.htm");close( ) 方法也是如此。
open （”打开窗口的 url” ，”窗口名”，”窗口特征”）
窗口的特征如下，可以任意组合：height ： 窗口高度； width ： 窗口宽度； top ： 窗口距离屏幕上方的象素值； left ：窗口距离屏幕左侧的象素值； toolbar ： 是否显示工具栏， yes 为显示； menubar ， scrollbars 表示菜单栏和滚动栏。 resizable ： 是否允许改变窗口大小， yes 或 1 为允许 location ： 是否显示地址栏， yes 或 1 为允许 status ：是否显示状态栏内的信息， yes 或 1 为允许；
我们需要预先制作好注册页面，假设为 register.html ，打开注册窗口的语句如下 open("register.html", " 注册窗口 ", "toolbars=0, location=0,
statusbars=0,menubars=0,width=700,height=550,scrollbars=1");
我们需要预先制作好注册页面，假设为 register.html ，打开注册窗口的语句如下 open("register.html", " 注册窗口 ", "toolbars=0, location=0,
statusbars=0,menubars=0,width=700,height=550,scrollbars=1");
通过 open 方法打开注册页面之后的效果
通过 open 方法打开注册页面之后的效果
<SCRIPT language="javascript">function openwindow( ) { window.status=" 系统当前状态：您正在注册用户 ......"; if (window.screen.width == 1024 && window.screen.height == 768) open("register.html", " 注册窗口 ", "toolbars=0, location=0, statusbars=0, menubars=0,width=700,height=550,scrollbars=1"); else window.alert(" 请设置分辨率为 1024x768 ，然后再打开 "); }function closewindow( ){ if(window.confirm(" 您确认要退出系统吗？ ")) window.close( );}</SCRIPT><INPUT type="button" name="regButton" value=" 用户注册 " onclick="openwindow( )"> <INPUT type="button" name="exitButton" value=" 退 出 " onclick="closewindow( )">
使用 Open 方法打开注册新窗口使用 Open 方法打开注册新窗口
添加单击事件添加单击事件
<SCRIPT language="javascript">function openwindow( ) { window.status=" 系统当前状态：您正在注册用户 ......"; if (window.screen.width == 1024 && window.screen.height == 768) open("register.html", " 注册窗口 ", "toolbars=0, location=0, statusbars=0, menubars=0,width=700,height=550,scrollbars=1"); else window.alert(" 请设置分辨率为 1024x768 ，然后再打开 ");}function closewindow( ){ if(window.confirm(" 您确认要退出系统吗？ ")) window.close( ); }</SCRIPT> <H3><A href="javascript: openwindow( ) "> 用户注册 </A></H3><H3><A href="javascript: closewindow( ) "> 退 出 </A></H3>
使用超链接调用方法来打开注册新窗口
使用超链接调用方法来打开注册新窗口
<HTML><HEAD><META http-equiv="Content-Type" content="text/html; charset=gb2312"><SCRIPT language="JavaScript" >function openwindow( ){ open("adv.htm", " 广告窗口 ", "toolbars=0, scrollbars=0, location=0, statusbars=0, menubars=0, resizable=0, width=700, height=250");}</SCRIPT></HEAD> <BODY onLoad="openwindow( )"> <H2> </H2> </BODY></HTML>
窗口完成文档加载时触发打开广告窗口
窗口完成文档加载时触发打开广告窗口
练习
编写如左图所示，具有自动打开广告窗口和在浏览器状态栏中显示“欢迎你 ......” 信息的页面。
广告窗口广告窗口
状态栏信息状态栏信息
9.2 文档 (document) 对象
DOM 是” Document Object Model” （文档对象模型）的首字母缩写。当创建了一个网页并把它加载到 Web 浏览器中时，就会在幕后创建一个文档对象模型。
DOM 表示被加载到浏览器窗口里的当前页面：浏览器向我们提供了当前页面的模型，而我们可以通过 JavaScript 访问这个模型。
DOM 把一份文档表示为一棵树。
9.2 文档 (document) 对象
9.2.1 document 对象的树结构根节点根节点 根节点
的子节点根节点
的子节点
有什么办法对 HTML 中的内容进行动态改变呢？
使用 Document Object Model使用 Document Object Model
相邻节点相邻节点
9.2.2 节点（ node ）
DOM 文档是由节点构成的集合，此时的节点是文档树上的树枝或者树叶。
DOM 中节点的类型： 元素节点（ element node ），诸如 <head> 、 <p> 、 <div>
等。元素节点可以包含其它的元素，唯一没有被包含在其它元素里的元素是 <html> ，它是根元素。
属性节点（ attribute node ），元素或多或少地有一些属性，属性可以对元素做出一些具体的描述。因为属性总是被放到起始标签里，所以属性节点总是被包含在元素节点中。
文本节点（ text node ）， <h1>元素中包含着文本节点“ Trees,
trees, everywhere” 。
访问指定节点 可以通过 document 对象中含有的集合来访问某些特定
类型的节点
9.2.2 节点（ node ）
使用 all 属性访问 HTML元素：
在文档对象中， all 是一个非常特殊的属性，通过它，可以访问文档中的所有 HTML元素对象。
使用 all 属性访问 HTML元素的方法有三种，即使用索引、 ID 和 HTML 标记名。
9.2.2 节点（ node ）
9.2.3 基本 DOM 方法
<html><head><script type="text/javascript">function changeLink(){ document.getElementById('myAnchor').innerHTML="搜狐 " ;document.getElementById('myAnchor').href="http://www.sohu.com" ; }</script></head><body><a id="myAnchor" href="http://www.taobao.com">淘宝 </a><input type="button" onclick="changeLink()" value=" 使用 DOM 改变链接 "></body></html>
修改内容修改内容
修改属性修改属性
HTML 文档的每个节点都是对象，类似WinForm 中的控件，都具备属性、方法和事件
HTML 文档的每个节点都是对象，类似WinForm 中的控件，都具备属性、方法和事件
定位链接元素（对象）定位链接元素（对象）
9.2.4 重要 DOM 属性属性名称 类型 说明nodeName String 节点名称nodeValue String 节点值
nodeType Number 节点类型firstChild Node 第一个子节点lastChild Node 最后一个子节点childNodes NodeList 所有子节点previousSibling Node 前一个节点nextSibling Node 后一个节点ownerDocument Document 获得该节点所属的文档对象attributes Map 代表一个节点的属性对象
9.3 表单 (form) 对象
表单对象（ Form）提供一个让客户端输入文字或进行选择的功能，例如：单选取按扭、复选框、选择列表等。
9.3.1 form 对象的属性
9.3.2 Form 对象的常用方法及事件
方法：
• 事件：
举例： Form 和 elements 的引用<body><form action="" method="get" onsubmit="show(this)">姓名： <input name="username" type="text" /><br/>密码： <input name="password" type="password" /><br/><input name="submit" type="submit" value=" 提交 "
/> <input name="reset" type="reset" value="重置 " /></form><script type="text/javascript">function show(form){
for(i=0;i<form.elements.length;i++)
document.write(form.elements[i].name+"="+form.elements[i].value+"<br/>");
}</script></body>
举例：页面浏览效果
点击“提交”按钮后的页面
9.3.2 表单处理
当用户单击了表单中的提交按扭之后，用户在表单中填写或选择的内容将被传送到服务器端特定的程序中，由该程序进行具体处理。虽然最终的表单处理通常都需要服务器端的支持，但还是有一些工作可以由客户端脚本来做，最典型的一个例子就是表单验证。
9.3.3 表单元素对象的属性、方法和事件 表单可以有很多表单元素，从对象角度来说，这些元素其实是表单对象的子对象，故称之为表单元素对象。
表单元素对象可以分为文本框 (Text) 、文本区(TextArea) 、密码 (Password) 、按钮 (Button) 、重置按钮 (Reset) 、提交按钮 (Submit) 、单选框(Radio) 、复选框 (Checkbox) 、列表 (Select) 、列表选项 (Option) 和隐藏 (Hidden) 对象等。
9.3.4 处理表单元素示例
表单元素对象的引用，类似于引用表单的通用属性。
假如有一个表单名为 text1 的的文本输入框，对这个文本输入框的引用方式如下：
document.myform. text1