JavaScript培训

1、动态网页脚本语言动态网页脚本语言JavaScript 主要内容 概述 编程基础 事件驱动 内置对象一浏览器对象 JavaScript是由网景公司开发的一种跨平台，面向对象(object-oriented)的网页脚本语言(Web Script Language)，是目前流行的网页特效设计语言。 JavaScript代码可直接嵌入HTML文件中，随网页一起传送到客户端浏览器，然后通过浏览器来解释执行。 JavaScript概述概述 什么是什么是JavaScript脚本语言？脚本语言？(1) 脚本语言脚本语言(Scripting Language)？ 由ASCII码构成，可直接用任何的文本编辑器开发

2、完成。是一种不必事先编译，只要利用适当的解释器(Interpreter)就可以执行的简单的解释式程序。(2) JavaScript？ JavaScript是由网景公司开发的一种跨平台，纯面向对象(object-oriented)式的网页式脚本语言(Web Script Language)。JavaScript代码可直接嵌入HTML文件中，随网页一起传送到客户端浏览器，然后通过浏览器的解释器来解释执行。 JavaScript概述概述 脚本编写语言 基于对象的语言 简单性 安全性 动态性 跨平台2. JavaScript的特点JavaScript概述概述 制作网页特效 提供表单前端验证 窗口动态操

3、作 提高系统工作效率3. JavaScript的功能的功能JavaScript概述概述 在在HTML标记中直接写入标记中直接写入JavaScript代码代码例： 鼠标移过来 运行4. 在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述 将JavaScript代码放入标记符中例如： document.write(欢迎您学习JavaScript!); 运行4. 在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述 将代码独立存储为以 .js 为扩展名的文件，利用SRC属性将该文件调入例如： welcome.js文件内容如下：

4、document.write(欢迎您学习JavaScript!);4. 在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述 为避免某些浏览器不完全支持JavaScript，而造成错误，可将JavaScript代码用注释语句括起来例如： 4. 在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述 数值(Number)：包含整数或浮点数。 逻辑值(Logical)：取值为true或false。 字符串(String)：用单引号或双引号括起来的零个或多个单一的字符所组成。 空值(null)：表示没有值，取唯一值”null”，大

5、小写敏感。 未定义值(undefined)：表示尚未定义值。注：null不能写成Null或NULL。null既不等于“0”，也不等于“空字符串”。因为“0”是数值，“空字符串”是字符串。 1. 数据类型数据类型JavaScript编程基础编程基础 自动数据类型转换 如果表达式中用（+）运算符，且其中一个操作数为字符串，另一个操作数为数值时，JavaScript自动将数值转成字符串。例如：var x=”我今年”+18; 结果：x=“我今年18” var x=”15”+8 结果：x=158 var y=15+8; 结果：y=23 如果表达式中用了其它运算符，JavaScript自动将字符串转成数值

6、。 例如：var x=”30”/5; 结果：x=6 var y=”15”-“8”; 结果：y=7 举例2. 数据类型转换数据类型转换JavaScript编程基础编程基础 数据类型转换函数 eval(字符串)：将传入的字符串参数内容，转换成相应的数值，例如： y=eval(“15”)+8; 结果：y=23 parseInt(字符串，底数)：将传入的字符串，转换成指定底数的数值。 parseFloat(字符串)：将传入的字符串，转换成浮点数值。 举例2. 数据类型转换数据类型转换JavaScript编程基础编程基础3. 变量变量JavaScript编程基础编程基础 变量命名 以字母或下划线开头（不

7、能以数字开头），后面接数字或其它字母。 变量名区分大小写。 例： var A=Uppercase A; var a=Lowercase a;document.write(A);document.write();document.write(a); 3. 变量变量JavaScript编程基础编程基础 变量的声明变量声明时，不必定义类型，所有类型均由小写的var声明。例如：var name; （JavaScript自动给出一个未定义值）var name,sex; （JavaScript自动给出一个未定义值）var name=”张永”，sex=”女生”； (二变量均为字符串) 3. 变量变量Java

8、Script编程基础编程基础 变量的作用域：全局变量(Global variable)和局部变量(Local variable)。 document.title = 变量的作用域实例; var gv = JavaScript; /gv是全局变量 document.write(test函数的输出：); test(); function test() var lv = VBScript; /lv是局部变量 document.write(gv= + gv + ); document.write(lv= + lv + + ); document.write(document的输出：); documen

9、t.write(gv= + gv + ); document.write(lv= + lv + ); 4. 常量常量JavaScript编程基础编程基础 字符串常量（String Literals） 一般字符串常量 特殊字符的字符串常量 布尔常量（Boolean Literals）：true或false。 整数常量（Integers Literals） 浮点常量（Floating-Point Literals） 数组常量（Array Literals）字符字符意义意义字符字符意义意义b后退一格(Backspace)t制表(Tab)f换页(Form feed)单引号n换行(New line)”双

10、引号r返回(Carriage return)反斜线(Backslash)5. 运算符与表达式运算符与表达式JavaScript编程基础编程基础 赋值运算符运算符运算符意义意义运算符运算符意义意义=x=5/=x=x/y+=x=x+y%=求余赋值-=x=x-y*=x=x*y5. 运算符与表达式运算符与表达式JavaScript编程基础编程基础 比较运算符 举例操作符描述举例A=B如果两个操作数相等，返回truePsw =passwordA!=B如果两个操作数不等，返回truemobile.length!=11A=B如果A大于或者等于B，返回truetries=2aB如果A大于B，返回truemfl

11、ag20A=b如果A小于或等于B，返回truei=0AB如果A小巧或等于B，返回truetries105. 运算符与表达式运算符与表达式JavaScript编程基础编程基础 算术运算符 举例运算符运算符意义意义运算符运算符意义意义运算符运算符意义意义+加(Addition)/除(Division)-递减(Decrement)-减(Subtraction)%求余(Modulus)-取负值(Unary Negation)*乘(Multiplication)+递增(Increment)5. 运算符与表达式运算符与表达式JavaScript编程基础编程基础 逻辑运算符 a&b ：逻辑与(Logical

12、 AND)，若a,b都是ture，则结果为ture。 a|b ：逻辑或(Logical OR) ，若a,b任一是ture，则结果为ture。 !a ：逻辑非(Logical NOT) ，若a是ture，则结果为false。 5. 运算符与表达式运算符与表达式JavaScript编程基础编程基础 字符串运算符（String operators） 条件运算符（？） 格式：条件表达式？值1：值2 如果条件表达式的结果是ture，返回值1，否则就返回值2。 举例 new：定义对象实例。 语法：对象名称 = new 对象类型（参数） 例如：myArray=new Array(3) 5. 运算符与表达式运

13、算符与表达式JavaScript编程基础编程基础 delete：删除对象、属性、数组、变量 格式：delete 对象名 delete 对象名.属性名 delete 数组名索引值 delete 变量名 注：删除成功返回true，删除失败返回flase 举例 typeof：用来判断操作数的类型 格式：typeof 操作数 或 typeof （操作数） 举例 this：代表当前对象，因此用在不同的地方，就有不同的结果。 举例6. 程序控制流程程序控制流程JavaScript编程基础编程基础 选择结构if 语句else 语句 if 语句组 else 语句组 if 语句组 else if 语句组 els

14、e 语句组 举例6. 程序控制流程程序控制流程JavaScript编程基础编程基础 选择结构Switch结构：switch ( ) case ：； case ：； default：； 6. 程序控制流程程序控制流程JavaScript编程基础编程基础 循环结构 while () 语句组 var i = 5; while ( i 0 ) document.write(i = ,i ,); i-; 6. 程序控制流程程序控制流程JavaScript编程基础编程基础 循环结构 do 语句或语句组while () var i = 5; do document.write(i = ,i ,); i-;

15、while ( i 0 ) 6. 程序控制流程程序控制流程JavaScript编程基础编程基础 循环结构 for ( 初始值初始值；条件条件；增量增量 ) for ( var i = 5; i 0; i- ) document.write(i = ,i ,); 6. 程序控制流程程序控制流程JavaScript编程基础编程基础 循环结构 for ( 变量 in 对象 ) 例1 例26. 程序控制流程程序控制流程JavaScript编程基础编程基础 循环结构循环结构 with ( ) document.write (限时抢购物品：); document.write (ViewSonic 17 显

16、示器。); document.write (EPSON 打印机。); with (document) write (限时抢购物品：); write (ViewSonic 17 显示器。); write (EPSON 打印机。); 6. 程序控制流程程序控制流程JavaScript编程基础编程基础 注释语句注释语句 l / l /* */JavaScript包含两类函数： 系统函数 用户自定义函数7. JavaScript函数函数JavaScript编程基础编程基础1) 编码函数功能：将字符串中非文字、数字字符（如&,%,#,空格符）转成相对应的ASCII值。语法：escape(字符串)2) 译

17、码函数功能：与escape()相反，将ASCII字符转回一般数字。语法：unescape(字符串)3) 求值函数功能：通常有两个用途，一个用作字符串的运算，另一个用来指出操作对象。 语法：eval (表达式)JavaScript编程基础编程基础4) 数值判断函数功能：判断变量的值是否为数值，“NaN”代表“Not a Number”，若返回值为true，则表示自变量不是数值。语法：isNaN(测试值)举例： var x = 15, y = 黄雅玲; document.write(x 不是数值吗？,isNaN(x); document.write(y 不是数值吗？,isNaN(y);执行结果：

18、x 不是数值吗？false y 不是数值吗？trueJavaScript编程基础编程基础5) 转成整数函数功能：将各种进制的数值转成十进制整数值。格式：parseInt(字符串，底数)举例： / 二进位转成十进位 document.write(11012 = ,parseInt(1101, 2),10); / 十六进位转成十进位 document.write(BFFF16 = ,parseInt(BFFF, 16),10);JavaScript编程基础编程基础6) 转成浮点函数功能：将字符串转成浮点数值。格式： parseFloat(字符串)举例： document.write(parseIn

19、t(3.123456), ); document.write(parseFloat(3.123456), ); JavaScript编程基础编程基础7) 用户自定义函数function 函数名（参数1，参数2，） return 定义函数的注意事项： 易于识别 功能模块化 放置在程序开始部分 例1 例2JavaScript编程基础编程基础JavaScript的事件处理的事件处理主要内容主要内容1、事件、事件 (Event)：鼠标或键盘的动作称为事件鼠标或键盘的动作称为事件 。2、事件驱动、事件驱动(Event Driver)：由事件引发的一连串由事件引发的一连串程序的动作，称为事件驱动。程序的动

20、作，称为事件驱动。3、事件处理程序、事件处理程序(Event Handler)：对事件进行处对事件进行处理的程序或函数。理的程序或函数。4、事件处理程序语法、事件处理程序语法 JavaScript的事件处理的事件处理1、常见事件、常见事件事件事件动作动作事件事件动作动作Abort中止正在加载的对象Unload关闭当前网页Blur失去焦点MouseDown按下鼠标左键Focus获取焦点MouseMove移动鼠标指针Change改变对象的值MouseOut鼠标指针离开某对象Click在对象上单击鼠标MouseOver鼠标指针悬停于某对象之上DblClick在对象上双击鼠标MouseUp放开鼠标左键

21、DrogDrop拖拽对象Move窗口被移动时Error加载文件或图形时发生错误Resize窗口大小被改变KeyDown按下键盘上的任意键的瞬间Select选择某对象KeyPress按下键盘上的任意键时Submit单击表单上的Submit按钮KeyUp某键被按下后弹起来的瞬间Reset单击表单上的Reset按钮Load 浏览器读入文件时JavaScript的事件处理的事件处理2、事件处理程序语法、事件处理程序语法 将事件处理程序直接嵌入HTML标记符中 例如： 浏览 直接写在对象后面 document.onLoad = alert(这是事件处理程序); 浏览 JavaScript的事件处理的事件

22、处理3、应用举例、应用举例 例1： 网络技术学习网 浏览JavaScript的事件处理的事件处理3、应用举例、应用举例例2请输入基本资料：姓名： 浏览 JavaScript提供了一些非常有用的常用内部对象和方法。用户不需要用脚本来实现这些功能。这正是基于对象编程的真正目的。本节主要介绍JavaScript提供的Array（数组）、string（字符串）、math（数值计算）和Date（日期）内置对象。 JavaScript内置对象内置对象JavaScript内置对象内置对象1. 数组数组(Array)对象对象格式：格式：对象名 = new Array(元素个数) 或 对象名 = new Arr

23、ay(值1,值2,)例如：例如：fruit=new Array(2) 声明了有2个元素的数组 fruit=new Array(“苹果”,”橘子”) 声明了有2个 数组元素的数组，并赋值。属性：属性：index：数组元素的索引值。 length：数组长度(数组元素个数)。方法：方法：join()：将数组内的所有值组合成一个字符串，并用特定符号分开。 toString()：以字符串来表示数组和数组值。 reverse()：将数组内元素的索引次序翻转过来 JavaScript内置对象内置对象1. 数组数组(Array)对象对象举例：举例：例1：一维数组应用例2：二维数组应用JavaScript内置对

24、象内置对象2. 字符串字符串(String)对象对象格式：格式：字符串变量名 = “字符串常数” 例如：例如：var str1=”JavaScript” /定义字符串变量属性：属性： length：字符串长度 方法：方法：包括字符串显示和运算两类方法包括字符串显示和运算两类方法举例：举例： 例1：属性length测试 例2：indexOf()函数应用 例3：大、小写转换JavaScript内置对象内置对象字符串字符串(String)对象的常用方法对象的常用方法anchor、link创建书签链接，相当于， 格式为String.anchor()创建超链接，相当于，格式为String.link(UR

25、L)big、small、italics、bold、blink、sup、sub、fontsize 、fontcolor 创建字符显示格式，相当于、等HTML标记。toLowerCase、toUpperCase字符串大小写转换indexOf、lastindexOf返回指定子字符串在字符串中第一次出现的左、右索引位置substring(start,end)返回从start开始到end的子字符（不包括end位置的字符）charAt返回某字符串中指定的子字符串返回JavaScript内置对象内置对象3. 数学数学(Math)对象对象属性：属性： E：欧拉常量：欧拉常量,自然对数的底自然对数的底(约等于约

26、等于2.718) LN2：2的自然对数的自然对数(约等于约等于0.693) LN10 ：10的自然对数的自然对数(约等于约等于2.302) LOG2E ：以：以2为底的为底的e的对数的对数(约等于约等于1.442) LOG10E：以：以10为底的为底的e的对数的对数(约等于约等于o.434) PI：的值的值(约等于约等于3.14159) SQRT1_2：0.5的平方根的平方根(约等于约等于o.707) SQRT2：2的平方根的平方根(约等于约等于1.414) JavaScript内置对象内置对象3. 数学数学(Math)对象对象方法：方法： abs() 返回某数的绝对值返回某数的绝对值 aco

27、s() 返回某数的反余弦值返回某数的反余弦值(以弧度为单位以弧度为单位) asin() 返回某数的反正弦值返回某数的反正弦值(以弧度为单位以弧度为单位) atan() 返回某数的反正切值返回某数的反正切值(以弧度为单位以弧度为单位) ceil() 返回大于或等于指定数的最小整数返回大于或等于指定数的最小整数 floor() 与与ceil相反相反 max() 返回两数间的较大值返回两数间的较大值 min() 返回两数问的较小值返回两数问的较小值 pow() 返回返回m的的n次方次方(其中其中,m为底为底,n为指数为指数) random() 返回返回0和和1之间的一个伪随机数之间的一个伪随机数 r

28、ound() 返回某数四舍五入之后的整数返回某数四舍五入之后的整数JavaScript内置对象内置对象4. 日期时间日期时间(Date)对象对象格式： 对象名 = new Date ( 日期参数 )举例： today = new Date () /以当日时间为对象初值。 today = new Date (“October 1,2002 12:00:00”) / 以英文表示月份，其余以数值表示，即【月日,年时:分:秒】。 today = new Date (“2002，08，07，0，0，0) 一律以数字表示，即【年,月,日,时,分,秒】。JavaScript内置对象内置对象4. 日期时间日期

29、时间(Date)对象对象方法: getYear()返回年份值 getMonth() 返回月份值 getDate() 并返回日期 getDay() 返回星期几 getHours() 返回小时数 getMinutes() 返回分钟数 getSeconds() 返回秒数 getTime() 返回完整的时间JavaScript内置对象内置对象4. 日期时间日期时间(Date)对象对象方法: setDate() 改变Date对象的日期 setHours() 改变小时数 setMinutes() 改变分钟数 setMonth() 改变月份 setSeconds() 改变秒数 setTime() 改变完整的

30、时间 setYear() 改变年份JavaScript内置对象内置对象4. 日期时间日期时间(Date)对象对象提示： 月份数为（0-11） 日期数为（1-31） 星期数为（0-6） 小时数为（0-23） 分钟数为（0-59） 秒数为 （0-59） 毫秒数为（0-999） JavaScript内置对象内置对象5. 举例举例 例1：Date对象常用方法测试 例2：显示当天的时间 例3：显示用户的进站时间 例4：倒计时JavaScript内置对象内置对象5. 用户自定义对象用户自定义对象在实际应用应用中，JavaScript提供的内置对象往往不能满足用户的需求，因此，常常需要建立用户自定义对象。对

31、象(Object)是一组经过组织的数据，在JavaScript中的每一个对象都有两个相关的成员，即属性(Property)和方法(Method)。建立自定义对象就是为对象定义属性和方法，其步骤是：1）写一个构造函数来定义对象类 为对象类定义属性 为对象类定义方法先将方法的名称放到对象的构造函数中写一个函数来描述该对象方法的内容2）利用new创建对象实例（Object Instance） 举例 JavaScript内置对象内置对象作业题作业题1、利用日期对象，对不同的进站时间，显示不同的、利用日期对象，对不同的进站时间，显示不同的提示信息。比如，上午六点到下午六点，显示提示信息。比如，上午六点到

32、下午六点，显示“将有将有限的时间用在作最有意义的事限的时间用在作最有意义的事”；其他时间显示；其他时间显示“现现在是休息时间在是休息时间”。（答案）（答案）2、检测用户输入的邮件格式是否正确。、检测用户输入的邮件格式是否正确。 （答案）（答案）3、用户进入时，显示、用户进入时，显示“欢迎您进入本网站！欢迎您进入本网站！”；离；离开时，显示开时，显示“谢谢您，欢迎下次再来！谢谢您，欢迎下次再来！”。答案：答案：JavaScript对象及其层次关系对象及其层次关系NavigatorPluginMineTypeWindowFrameDocumentLocationHistoryCookieAncho

33、rAppletAreaFormImageLinkLayerCheckBoxRadioSubmitHiddenPasswardFileUploadTextTextareaSelectResetButtonOption1.功能：功能：顶层对象顶层对象,用来表示浏览器所打开的窗口。用来表示浏览器所打开的窗口。2.格式格式指定窗口：指定窗口： 窗口名窗口名.属性属性 窗口名窗口名.方法（参数群）方法（参数群）打开当前窗口的窗口：打开当前窗口的窗口：opener.属性属性 opener.方法（参数群）方法（参数群）框架中的顶级窗口：框架中的顶级窗口： top.属性属性 top.方法（参数群）方法（参数群

34、）当前活动窗口：当前活动窗口： self.属性属性 self.方法（参数群）方法（参数群）例如：例如：win1.document.title=“广告窗口广告窗口” self.close() opener.document.forms0.user.value=“张永张永”窗口对象窗口对象(WINDOW)3.属性属性Name 窗口的名字。窗口的名字。closed 判断窗口是否已经被关闭，返回布尔值。判断窗口是否已经被关闭，返回布尔值。document 包含当前文档的信息，包含当前文档的信息，(该属性本身也是一个对象该属性本身也是一个对象)frames 窗口的框架对象数组窗口的框架对象数组, 以数组

35、索引值表示，以数组索引值表示，(该属性本该属性本身也是一个对象身也是一个对象)。history 当前窗口最近浏览过的网页当前窗口最近浏览过的网页(该属性本身也是一个对该属性本身也是一个对象象)。location 窗口所显示文档的完整窗口所显示文档的完整URL(该属性本身也是一个对该属性本身也是一个对象象)。length 窗口内的框架个数。窗口内的框架个数。opener 代表使用代表使用open打开当前窗口的脚本所在的窗口。打开当前窗口的脚本所在的窗口。self 代表当前窗口。代表当前窗口。top 代表当前框架的最顶层窗口。代表当前框架的最顶层窗口。窗口对象窗口对象(WINDOW)3.属性属性d

36、efaultStatus 缺省的状态栏信息。缺省的状态栏信息。status 状态栏中的信息。状态栏中的信息。scrollbars 浏览器的滚动条（包括水平和垂直滚动条）。浏览器的滚动条（包括水平和垂直滚动条）。toolbar 浏览器的工具栏。浏览器的工具栏。menubar 浏览器的菜单栏。浏览器的菜单栏。locationbar 浏览器的地址栏。浏览器的地址栏。innerHeight 窗口内容区的高度（以像素表示）。窗口内容区的高度（以像素表示）。innerWidth 窗口内容区的宽度（以像素表示）。窗口内容区的宽度（以像素表示）。outerHeight 窗口边界的高度（以像素表示）。窗口边界的

37、高度（以像素表示）。outerWidth 窗口边界的宽度（以像素表示）。窗口边界的宽度（以像素表示）。pageXOffset 网页网页x-position的位置（以像素表示）。的位置（以像素表示）。pageYOffset 网页网页y-position的位置（以像素表示）。的位置（以像素表示）。窗口对象窗口对象(WINDOW)4.方法方法open(URL，窗口名称，窗口名称，窗口规格，窗口规格) 打开一个新窗口。打开一个新窗口。close() 关闭窗口。关闭窗口。MoveBy(水平点数，垂直点数水平点数，垂直点数) MoveTo(x，y) 将窗口移动至（将窗口移动至（x,y）坐标处，参数取绝对）

38、坐标处，参数取绝对值。值。ResizeBy(水平点数，垂直点数水平点数，垂直点数) 调整窗口大小（往右调整窗口大小（往右/往往下），参数取相对值。下），参数取相对值。ResizeTo(宽度，高度宽度，高度)setTimeout(表达式，毫秒数表达式，毫秒数) 等待一段指定的毫秒数时间等待一段指定的毫秒数时间,然后运行指令。然后运行指令。clearTimeout(定时器对象定时器对象) 清除清除 setTimeout定义的计时程定义的计时程序。序。窗口对象窗口对象(WINDOW)4.方法方法setInterval(表达式，毫秒数表达式，毫秒数) 设置一个定时程序。设置一个定时程序。clearIn

39、terval(定时器对象定时器对象) 清除清除 setInterval定义的计时器定义的计时器focus() 将焦点移到此窗口。将焦点移到此窗口。blur() 把焦点从指定窗口移开。把焦点从指定窗口移开。home() 进入客户端在浏览器上设置的主页。进入客户端在浏览器上设置的主页。stop() 停止加载网页内容。停止加载网页内容。back() 返回历史记录的上一个网页。返回历史记录的上一个网页。forward() 加载历史记录的下一个网页。加载历史记录的下一个网页。alert(字符串字符串) 传送警告信息。传送警告信息。confirm(字符串字符串) 打开一个打开一个Confirm消息框消息框

40、,用户可以选择用户可以选择OK或或Cancel，如果用户单击，如果用户单击OK,该方法返回该方法返回true，单击，单击Cancel返返回回false。prompt(“提示字符串提示字符串”，默认值，默认值) 打开一个打开一个Prompt对话框对话框,用户可向该框键入文本用户可向该框键入文本,并把键入的文本返回到脚本。并把键入的文本返回到脚本。 窗口对象窗口对象(WINDOW)5.事件事件 onBlur onDragDrop onError onFocus onLoad onUnload onMove onResize 窗口对象窗口对象(WINDOW)6.举例举例例例1：改变窗口的大小实例改变

41、窗口的大小实例例例2：打开窗口打开窗口例例3：Prompt方法实例方法实例例例4：setInterval实例实例例例5：setTimeout实例实例例例6：WINDOW对象综合实例对象综合实例窗口对象窗口对象(WINDOW) 单击单击“来者何人来者何人”，打开一，打开一200*100的窗口。的窗口。 打开网页时，自动打开一打开网页时，自动打开一300*100的窗口。的窗口。作作 业业1.功能功能 它为它为window对象的一个属性对象的一个属性,用来存储客户端最近用来存储客户端最近访问过的网页清单。访问过的网页清单。2.格式格式history.属性属性history.方法（参数）方法（参数）

42、3.属性属性length 存储在记录清单中的网页数目。存储在记录清单中的网页数目。current 当前网页的地址。当前网页的地址。next 下一个历史记录的网页地址。下一个历史记录的网页地址。previous 上一个历史记录的网页地址。上一个历史记录的网页地址。 历史对象历史对象(HISTORY)4.方法方法back 回到客户端查看过的上一页。回到客户端查看过的上一页。forward 回到客户端查看过的下一页。回到客户端查看过的下一页。go（整数或（整数或URL字符串）字符串） 前往历史记录中的某个网前往历史记录中的某个网页页5.举例举例例：例：history对象实例对象实例历史对象历史对象(

43、HISTORY)继续历史对象历史对象(HISTORY)WIN1WIN2WIN3WIN4WIN5WIN6history.back()history.forward()history.go()返回1.功能功能代表特定窗口的代表特定窗口的URL信息。一个完整的信息。一个完整的URL格式如下：格式如下： protocol / host：port / path # hash ? search其中其中 protocol：通信协议通信协议 host：主机名称主机名称 port：通信端口通信端口 path：文件路径文件路径 hash：定位锚点定位锚点 search：查询信息查询信息 位置对象位置对象(LOCA

44、TION)2.语法语法 location.属性属性 location.方法（参数）方法（参数）3.属性属性 hash URL中定位锚点名称。中定位锚点名称。 host URL中主机名部分。中主机名部分。 hostname URL中中host：port部分。部分。 href 完整的完整的URL字符串。字符串。 pathname URL中中path部分。部分。 port URL的的:端口端口port部分。部分。 protocol URL的通信协议。的通信协议。 search 以问号以问号(?)开始的开始的URL中的一部分中的一部分,用于指用于指定搜索信息。定搜索信息。位置对象位置对象(LOCATI

45、ON)4.方法方法reload() 重新加载（刷新）当前的网页。重新加载（刷新）当前的网页。replace(网址网址) 用特定的网页取代当前的网页。用特定的网页取代当前的网页。5.举例举例例例1：用普通文字实现超链接的范例用普通文字实现超链接的范例 例例2：自动打开网页范例自动打开网页范例 位置对象位置对象(LOCATION) 每一个框架对象相当于窗口每一个框架对象相当于窗口(WINDOW)对象，对象，因此框架对象可以使用窗口对象的所有属性和方法。因此框架对象可以使用窗口对象的所有属性和方法。 框架对象框架对象(FRAME)downFrameupFrameleftFrametoptopleft

46、FrameupFramedownFrame1.框架组的结构框架组的结构 2.框架组的层次框架组的层次 3.框架的引用框架的引用top.leftFrametop. upFrametop. downFrame或或top.frames0top.frames1top.frames24.举例举例框架对象框架对象(FRAME) 文件对象文件对象(Document)代表当前的代表当前的HTML对象，对象，是由是由标记组构成的，标记组构成的，JavaScript自动为每一自动为每一个个HTML文件建立一个文件建立一个document对象，用来显示对象，用来显示HTML文件。文件。 文档对象文档对象(DOCUM

47、ENT)1.语法语法 document.属性属性 document.方法方法2.属性属性 link 文档中的一个文档中的一个标记标记(该属性本身也该属性本身也是一个对象是一个对象)。 links 文件中的所有链接，以数组索引值表示。文件中的所有链接，以数组索引值表示。 linkColor 文档的链接的颜色文档的链接的颜色,即即标记中的标记中的LINK属性。属性。 alinkColor 活动链接的颜色活动链接的颜色(ALINK)。 vlinkColor 指向已点击过的超链接文本颜色指向已点击过的超链接文本颜色,即即标记的标记的VLINK特性特性 forms 文件中的所有表单，以数组索引值表示。文

48、件中的所有表单，以数组索引值表示。文档对象文档对象(DOCUMENT)2.属性属性 images 文档中所有文档中所有image，以数组索引值表示。，以数组索引值表示。 anchors 文档中所有锚点，以数组索引值表示。文档中所有锚点，以数组索引值表示。 bgColor 文档的背景颜色文档的背景颜色(BGCOLOR)。 fgColor 文档中文本颜色文档中文本颜色(中的中的TEXT特性特性) cookie 存储于存储于cookie.txt文件内的一段信息文件内的一段信息,它是该它是该文档对象的一个属性文档对象的一个属性 URL 表示该文件的网址。表示该文件的网址。 title 文档的标题文档的

49、标题(TITLE)。 lastModified 文档最后的修改日期。文档最后的修改日期。 文档对象文档对象(DOCUMENT)3.方法方法 write（字符串）（字符串）将字符串或数值写到文件中。将字符串或数值写到文件中。 getSelection() 取得当前选取的字符串。取得当前选取的字符串。4.事件事件onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp 5.举例举例例例1：测试文件对象的颜色属性测试文件对象的颜色属性 例例2：网页修改日期时间网页修改日期时间 文档对象文档对象(DOCUMENT) 当文

50、档中包含当文档中包含标记时，标记时，JavaScript自动建立相自动建立相对应的锚点对象。这些对象可以用对应的锚点对象。这些对象可以用document的的anchors属性，搭配数组的索引方式来进行访问控制。例如：属性，搭配数组的索引方式来进行访问控制。例如：文件中的第一个锚点对象，叫做文件中的第一个锚点对象，叫做document. anchors 0, 第二个锚点对象，叫做第二个锚点对象，叫做document. anchors 1,依次类推。依次类推。锚点对象锚点对象(ANCHORS)1.语法语法document.锚点名锚点名.属性属性document.锚点名锚点名.方法方法或或docum

51、ent.anchors.属性属性 document.anchors.方法方法2.属性属性name 表示锚点的名称。表示锚点的名称。锚点对象锚点对象(ANCHORS) 无论是文字、图形或图像映射，只要是用来作为无论是文字、图形或图像映射，只要是用来作为超级链接用的对象，超级链接用的对象，JavaScript自动建立相对应的链自动建立相对应的链接对象。这些对象可以用接对象。这些对象可以用document的的links属性，搭属性，搭配数组的索引方式来进行访问控制。例如：文件中的配数组的索引方式来进行访问控制。例如：文件中的第一个链接对象，叫做第一个链接对象，叫做document.links0, 第

52、二个链第二个链接对象，叫做接对象，叫做document.links1,依次类推。依次类推。 链接对象链接对象(LINKS)1.语法语法document.链接名链接名.属性属性 document. 链接名链接名.方法方法或或document.links.属性属性 document.links.方法方法2.属性属性hash 表示表示URL字符串中锚点的名称。字符串中锚点的名称。host 表示主机域名或表示主机域名或IP地址。地址。hostname 表示表示URL当中的当中的host与与port的部分。的部分。href 完整的完整的URL字符串。字符串。pathname 表示表示URL当中的目录路径

53、当中的目录路径(path)部分。部分。链接对象链接对象(LINKS)2.属性属性port 表示表示URL当中的通信端口当中的通信端口(port)部分。部分。protocol 表示表示URL当中的通信协议部分当中的通信协议部分search 表示表示URL当中的查询字符串部分。当中的查询字符串部分。target 代表目标的窗口，即代表目标的窗口，即HTML中的中的TARGET属性属性text 表示表示A标记中的文字。标记中的文字。3.事件事件onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp、onMouseOu

54、t、onMouseDown4.举例举例链接对象链接对象(LINKS) 当文件中包含当文件中包含标记时，标记时，JavaScript自动自动建立相对应的图像对象。这些对象可以用建立相对应的图像对象。这些对象可以用document的的images属性，搭配数组的索引方式来进行访问控属性，搭配数组的索引方式来进行访问控制。例如：文件中的第一个图像对象，叫做制。例如：文件中的第一个图像对象，叫做document. images 0, 第二个图像对象，叫做第二个图像对象，叫做document. images 1,依次类推。依次类推。图像对象图像对象(IMAGES)1.建立图像对象：建立图像对象：new

55、image(宽度宽度,高度高度)2.属性属性src 图像的图像的URL，SRC属性。属性。border 图像的边框，图像的边框，标记的标记的BORDER属性。属性。width 图像的宽度，图像的宽度，WIDTH属性。属性。height 图像的高度，图像的高度，HEIGHT属性。属性。hspace 图像水平空白，图像水平空白，HSPACE属性。属性。vspace 图像垂直空白，图像垂直空白，VSPACE属性。属性。lowsrc 图像的第分辨率版本，图像的第分辨率版本，LOWSRC属性。属性。complete 表示浏览器是否完成了图像的加载，一个表示浏览器是否完成了图像的加载，一个布尔值。布尔值。

56、3.事件事件:onAbort、onError、onLoad、onKeyDown、onKeyPress、onKeyUp 图像对象图像对象(IMAGES) 表单对象表单对象(Form)提供一个让客户端输入文字或进提供一个让客户端输入文字或进行选择的功能，例如：单选按钮、复选框、选择列表等。行选择的功能，例如：单选按钮、复选框、选择列表等。由由标记组构成，标记组构成，JavaScript自动建立一个表自动建立一个表单对象，并将用户端的信息送至服务器进行处理。表单单对象，并将用户端的信息送至服务器进行处理。表单对象是文件对象的子对象，同时，它也包含许多子对象。对象是文件对象的子对象，同时，它也包含许多

57、子对象。 表单对象表单对象(FORM)1.表单对象的使用格式表单对象的使用格式document.forms索引值索引值.属性属性 document.forms索引值索引值.方法（参数群）方法（参数群） 或或document.表单名称表单名称.属性属性document.表单名称表单名称.方法（参数群）方法（参数群）2.常用属性常用属性 Name：表单名，相当于表单名，相当于标记的标记的name属性属性Action：相当于相当于标记的标记的ACTION属性。属性。Method：输入窗体的数据传送到服务器上的方式输入窗体的数据传送到服务器上的方式,即即(FORM)标记中的标记中的METHOD属性。属

58、性。Elements：表单中的所有控件，以数组索引值表示表单中的所有控件，以数组索引值表示Length：表单中的控件的个数。表单中的控件的个数。 表单对象表单对象(FORM)2.常用属性常用属性 Checkbox：复选框，复选框，(该属性本身也是一个对象该属性本身也是一个对象)。Hidden：隐藏对象。隐藏对象。Button：按钮，按钮，(该属该属性本身也是一个对象性本身也是一个对象)。Radio：单选按钮，单选按钮，(该属性本身也是一个对象该属性本身也是一个对象)。Reset：复位按钮，复位按钮，(该属性自身也是一个对象该属性自身也是一个对象)。Submit：提交按钮，提交按钮，(该属性本身

59、也是一个对象该属性本身也是一个对象)。Text：单行文本，单行文本，(该属性本身也是一个对象该属性本身也是一个对象)。Textarea:多行文本，多行文本，(该属性本身也是一个对象该属性本身也是一个对象)。Select:选择框，选择框，(该属性本身也是一个对该属性本身也是一个对象象)。表单对象表单对象(FORM)3.常用方法常用方法 Submit() 提交表单提交表单(与与Submit按钮的作用相同按钮的作用相同)。reset() 重写表单重写表单(与使用与使用reset按钮的作用相同按钮的作用相同)。 表单对象表单对象(FORM) 表单对象表单对象(Form)提供一个让客户端输入文字或进提供

60、一个让客户端输入文字或进行选择的功能，例如：单选按钮、复选框、选择列表等。行选择的功能，例如：单选按钮、复选框、选择列表等。由由标记组构成，标记组构成，JavaScript自动建立一个表自动建立一个表单对象，并将用户端的信息送至服务器进行处理。表单单对象，并将用户端的信息送至服务器进行处理。表单对象是文件对象的子对象，同时，它也包含许多子对象。对象是文件对象的子对象，同时，它也包含许多子对象。 表单对象表单对象(FORM)1.表单对象的使用格式表单对象的使用格式document.forms索引值索引值.属性属性 document.forms索引值索引值.方法（参数群）方法（参数群） 或或doc