《JavaScript编程基础.ppt》由会员分享,可在线阅读,更多相关《JavaScript编程基础.ppt(114页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、JavaScript编程基础编程基础 主要内容主要内容1概述概述2编程基础编程基础3事件驱动事件驱动4内置对象内置对象5浏览器对象浏览器对象 JavaScript是由网景公司开发的一种跨平台,面向是由网景公司开发的一种跨平台,面向对象对象(object-oriented)的网页脚本语言的网页脚本语言(Web Script Language),是目前流行的网页特效设计语言。,是目前流行的网页特效设计语言。JavaScript代码可直接嵌入代码可直接嵌入HTML文件中,随网页文件中,随网页一起传送到客户端浏览器,然后通过浏览器来解释执行。一起传送到客户端浏览器,然后通过浏览器来解释执行。JavaS
2、cript概述概述1.什么是什么是JavaScript脚本语言?脚本语言?(1)脚本语言脚本语言(Scripting Language)?由由ASCII码构成,可直接用任何的文本编辑器开码构成,可直接用任何的文本编辑器开发完成。是一种不必事先编译,只要利用适当的发完成。是一种不必事先编译,只要利用适当的解释器解释器(Interpreter)就可以执行的简单的解释式就可以执行的简单的解释式程序。程序。(2)JavaScript?JavaScript是由网景公司开发的一种跨平台,纯是由网景公司开发的一种跨平台,纯面向对象面向对象(object-oriented)式的网页式脚本语言式的网页式脚本语言
3、(Web Script Language)。JavaScript代码可代码可直接嵌入直接嵌入HTML文件中,随网页一起传送到客户文件中,随网页一起传送到客户端浏览器,然后通过浏览器的解释器来解释执行。端浏览器,然后通过浏览器的解释器来解释执行。JavaScript概述概述 脚本编写语言脚本编写语言 基于对象的语言基于对象的语言 简单性简单性 安全性安全性 动态性动态性 跨平台跨平台2.JavaScript的特点的特点*JavaScript概述概述*这部分属于文字介绍性质,请自行阅读教科书完成学习。这部分属于文字介绍性质,请自行阅读教科书完成学习。制作网页特效制作网页特效 提供表单前端验证提供表
4、单前端验证 窗口动态操作窗口动态操作 提高系统工作效率提高系统工作效率3.JavaScript的功能的功能*JavaScript概述概述*这部分属于文字介绍性质,请自行阅读教科书完成学习。这部分属于文字介绍性质,请自行阅读教科书完成学习。在在HTML标记中直接写入标记中直接写入JavaScript代码代码例:例:鼠标移过来鼠标移过来 4.在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述提问:与滚动字幕嵌套使用时,有效范围是多大的空间?提问:与滚动字幕嵌套使用时,有效范围是多大的空间?将将JavaScript代码放入代码放入标记标记符中符中例如:例如:do
5、cument.write(欢迎您学习欢迎您学习JavaScript!);提问:提问:双边标记和双边标记和双边标记如何嵌套使双边标记如何嵌套使用?用?4.在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述 将代码独立存储为以将代码独立存储为以.js 为扩展名的文件,利用为扩展名的文件,利用SRC属性将该文件调入属性将该文件调入例如:例如:welcome.js文件内容如下:文件内容如下:document.write(欢迎您学习欢迎您学习JavaScript!);4.在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述提问:通
6、过提问:通过.js引用和引用和双边标记如何嵌套使用?双边标记如何嵌套使用?为避免某些浏览器不完全支持为避免某些浏览器不完全支持JavaScript,而造成,而造成错误,可将错误,可将JavaScript代码用注释语句括起来代码用注释语句括起来例如:例如:4.在在HTML文档中嵌入文档中嵌入JavaScript代码代码JavaScript概述概述数值数值(Number):包含整数或浮点数。包含整数或浮点数。逻辑值逻辑值(Logical):取值为取值为true或或false。字符串字符串(String):用单引号或双引号括起来的零个或用单引号或双引号括起来的零个或多个单一的字符所组成。多个单一的字
7、符所组成。空值空值(null):表示没有值,取唯一值表示没有值,取唯一值”null”,大小,大小写敏感。写敏感。未定义值未定义值(undefined):表示尚未定义值。表示尚未定义值。注:注:null不能写成不能写成Null或或NULL。null既不等于既不等于“0”,也不等于,也不等于“空字符串空字符串”。因为。因为“0”是数值,是数值,“空字符串空字符串”是字符串。是字符串。1.数据类型数据类型JavaScript编程基础编程基础a)自动数据类型转换自动数据类型转换 如果表达式中用(如果表达式中用(+)运算符,且其中一个操作数)运算符,且其中一个操作数为字符串,另一个操作数为数值时,为字符
8、串,另一个操作数为数值时,JavaScript自自动将数值转成字符串。动将数值转成字符串。例如:例如:var x=”我今年我今年”+18;结果:结果:x=“我今年我今年18”var x=”15”+8 结果:结果:x=158 var y=15+8;结果:结果:y=23 如果表达式中用了其它运算符,如果表达式中用了其它运算符,JavaScript自动将自动将字符串转成数值。字符串转成数值。例如:例如:var x=”30”/5;结果:结果:x=6 var y=”15”-“8”;结果:结果:y=7 2.数据类型转换数据类型转换JavaScript编程基础编程基础b)数据类型转换函数数据类型转换函数 e
9、val(字符串字符串):将传入的字符串参数内容,转换将传入的字符串参数内容,转换成相应的数值,例如:成相应的数值,例如:y=eval(“15”)+8;结果:结果:y=23 parseInt(字符串,字符串,底数底数):将传入的字符串,将传入的字符串,转换成指定底数的数值。转换成指定底数的数值。parseFloat(字符串字符串):将传入的字符串,转换成将传入的字符串,转换成浮点数值。浮点数值。2.数据类型转换数据类型转换JavaScript编程基础编程基础3.变量变量JavaScript编程基础编程基础a)变量命名变量命名 以字母或下划线开头(不能以数字开头),后面接以字母或下划线开头(不能以
10、数字开头),后面接数字或其它字母。数字或其它字母。变量名区分大小写。变量名区分大小写。例:例:var A=Uppercase A;var a=Lowercase a;document.write(A);document.write();document.write(a);3.变量变量JavaScript编程基础编程基础b)变量的声明变量的声明变量声明时,不必定义类型,所有类型均由小写的变量声明时,不必定义类型,所有类型均由小写的var声明。声明。例如:例如:var name;(JavaScript自动给出一个未定义值)自动给出一个未定义值)var name,sex;(JavaScript自动给
11、出一个未定义自动给出一个未定义值)值)var name=”张永张永”,sex=”女生女生”;(二变量均二变量均为字符串为字符串)3.变量变量JavaScript编程基础编程基础c)变量的作用域:变量的作用域:全局变量全局变量(Global variable)和局部和局部变量变量(Local variable)。document.title=变量的作用域实例变量的作用域实例;var gv=JavaScript;/gv是全局变量是全局变量 document.write(test函数的输出:函数的输出:);test();function test()var lv=VBScript;/lv是局部变量是
12、局部变量 document.write(gv=+gv+);document.write(lv=+lv+);document.write(document的输出:的输出:);document.write(gv=+gv+);document.write(lv=+lv+);4.常量常量JavaScript编程基础编程基础a.字符串常量(字符串常量(String Literals)一般字符串常量一般字符串常量特殊字符的字符串常量特殊字符的字符串常量b.布尔常量(布尔常量(Boolean Literals):):true或或false。c.整数常量(整数常量(Integers Literals)d.浮点
13、常量(浮点常量(Floating-Point Literals)e.数组常量(数组常量(Array Literals)字符字符意意义义字符字符意意义义b后退一格后退一格(Backspace)t制表制表(Tab)f换页换页(Form feed)单单引号引号n换换行行(New line)”双引号双引号r返回返回(Carriage return)反斜反斜线线(Backslash)5.运算符与表达式运算符与表达式JavaScript编程基础编程基础a)赋值运算符赋值运算符运算符运算符意意义义运算符运算符意意义义=x=5/=x=x/y+=x=x+y%=求余求余赋值赋值-=x=x-y*=x=x*y5.运算
14、符与表达式运算符与表达式JavaScript编程基础编程基础b)比较运算符比较运算符c)操作符操作符描述描述举举例例A=B如果两个操作数相等,返回如果两个操作数相等,返回truePswPsw=password=passwordA!=B如果两个操作数不等,返回如果两个操作数不等,返回truemobile.lengthmobile.length!=11!=11A=B如果如果A大于或者等于大于或者等于B,返回,返回truetries=2tries=2aB如果如果A大于大于B,返回,返回truemflagmflag2020A=b如果如果A小于或等于小于或等于B,返回,返回truei=0i=0AB如果如
15、果A小巧或等于小巧或等于B,返回,返回truetries10tries105.运算符与表达式运算符与表达式JavaScript编程基础编程基础c)算术运算符算术运算符运算符运算符意意义义运算符运算符意意义义运算符运算符意意义义+加加(Addition)/除除(Division)-递递减减(Decrement)-减减(Subtraction)%求余求余(Modulus)-取取负值负值(Unary Negation)*乘乘(Multiplication)+递递增增(Increment)5.运算符与表达式运算符与表达式JavaScript编程基础编程基础d)逻辑运算符逻辑运算符 a&b:逻辑与逻辑与
16、(Logical AND),若,若a,b都是都是ture,则结果为,则结果为ture。a|b:逻辑或逻辑或(Logical OR),若,若a,b任一是任一是ture,则结果为,则结果为ture。!a:逻辑非逻辑非(Logical NOT),若,若a是是ture,则结果,则结果为为false。5.运算符与表达式运算符与表达式JavaScript编程基础编程基础e)字符串运算符(字符串运算符(String operators)f)条件运算符(?)条件运算符(?)格式:格式:条件表达式?条件表达式?值值1:值值2 如果条件表达式的结果是如果条件表达式的结果是ture,返回值,返回值1,否则就返,否则
17、就返回值回值2。g)new:定义对象实例。定义对象实例。语法:对象名称语法:对象名称=new 对象类型(参数)对象类型(参数)例如:例如:myArray=new Array(3)5.运算符与表达式运算符与表达式JavaScript编程基础编程基础h)delete:删除对象、属性、数组、变量删除对象、属性、数组、变量i)格式:格式:delete 对象名对象名 delete 对象名对象名.属性名属性名 delete 数组名数组名索引值索引值 delete 变量名变量名 注:删除成功返回注:删除成功返回true,删除失败返回,删除失败返回flase i)typeof:用来判断操作数的类型用来判断操作
18、数的类型 格式:格式:typeof 操作数操作数 或或 typeof(操作数)(操作数)j)this:代表当前对象,因此用在不同的地方,就有不同的结代表当前对象,因此用在不同的地方,就有不同的结果。果。6.程序控制流程程序控制流程JavaScript编程基础编程基础a)选择结构选择结构if 语句语句else 语句语句 if 语句组语句组 else 语句组语句组 if 语句组语句组 else if 语句组语句组 else 语句组语句组 6.程序控制流程程序控制流程JavaScript编程基础编程基础a)选择结构选择结构Switch结构:结构:switch()case:;case:;default
19、:;6.程序控制流程程序控制流程JavaScript编程基础编程基础b)循环结构结构 while()语句组语句组 var i=5;while(i 0)document.write(i=,i,);i-;6.程序控制流程程序控制流程JavaScript编程基础编程基础b)循环结构循环结构 do 语句或语句组语句或语句组while()var i=5;do document.write(i=,i,);i-;while(i 0)6.程序控制流程程序控制流程JavaScript编程基础编程基础b)循环结构循环结构 for(初始值初始值;条件条件;增量增量)for(var i=5;i 0;i-)docume
20、nt.write(i=,i,);6.程序控制流程程序控制流程JavaScript编程基础编程基础b)循环结构循环结构 for(变量变量 in 对象对象)6.程序控制流程程序控制流程JavaScript编程基础编程基础b)循环结构循环结构 with()document.write(限时抢购物品:限时抢购物品:);document.write(ViewSonic 17 显示器。显示器。);document.write(EPSON 打印机。打印机。);6.程序控制流程程序控制流程JavaScript编程基础编程基础c)注释语句注释语句 /*/JavaScript包含两类函数:包含两类函数:系统函数系
21、统函数 用户自定义函数用户自定义函数7.JavaScript函数函数JavaScript编程基础编程基础1)编码函数编码函数功能:功能:将字符串中非文字、数字字符(如将字符串中非文字、数字字符(如&,%,#,空空格符格符)转成相对应的)转成相对应的ASCII值。值。语法:语法:escape(字符串字符串)2)译码函数译码函数功能:功能:与与escape()相反,将相反,将ASCII字符转回一般数字。字符转回一般数字。语法:语法:unescape(字符串字符串)3)求值函数求值函数功能:功能:通常有两个用途,一个用作字符串的运算,另一通常有两个用途,一个用作字符串的运算,另一个用来指出操作对象。
22、个用来指出操作对象。语法:语法:eval(表达式表达式)JavaScript编程基础编程基础4)数值判断函数数值判断函数功能:功能:判断变量的值是否为数值,判断变量的值是否为数值,“NaN”代表代表“Not a Number”,若返回值为,若返回值为true,则表示自变量不是数值。,则表示自变量不是数值。语法:语法:isNaN(测试值测试值)举例:举例:var x=15,y=黄雅玲黄雅玲;document.write(x 不是数值吗?不是数值吗?,isNaN(x);document.write(y 不是数值吗?不是数值吗?,isNaN(y);执行结果:执行结果:x 不是数值吗?不是数值吗?fa
23、lse y 不是数值吗?不是数值吗?trueJavaScript编程基础编程基础5)转成整数函数转成整数函数功能:功能:将各种进制的数值转成十进制整数值。将各种进制的数值转成十进制整数值。格式:格式:parseInt(字符串字符串,底数,底数)举例:举例:/二进位转成十进位二进位转成十进位 document.write(11012=,parseInt(1101,2),10);/十六进位转成十进位十六进位转成十进位 document.write(BFFF16=,parseInt(BFFF,16),10);JavaScript编程基础编程基础6)转成浮点函数转成浮点函数功能:功能:将字符串转成浮点
24、数值。将字符串转成浮点数值。格式:格式:parseFloat(字符串字符串)举例:举例:document.write(parseInt(3.123456),);document.write(parseFloat(3.123456),);JavaScript编程基础编程基础7)用户自定义函数用户自定义函数function 函数名(函数名(参数参数1,参数,参数2,)return 定义函数的注意事项:定义函数的注意事项:易于识别易于识别 功能模块化功能模块化 放置在程序开始部分放置在程序开始部分JavaScript编程基础编程基础JavaScript的事件处理的事件处理主要内容主要内容1、事件、事
25、件(Event):鼠标或键盘的动作称为事件鼠标或键盘的动作称为事件。2、事件驱动、事件驱动(Event Driver):由事件引发的一连串程由事件引发的一连串程序的动作,称为事件驱动。序的动作,称为事件驱动。3、事件处理程序、事件处理程序(Event Handler):对事件进行处理对事件进行处理的程序或函数。的程序或函数。4、事件处理程序语法、事件处理程序语法 JavaScript的事件处理的事件处理1、常见事件、常见事件事件事件动动作作事件事件动动作作Abort中止正在加载的对象Unload关闭当前网页Blur失去焦点MouseDown按下鼠标左键Focus获取焦点MouseMove移动鼠
26、标指针Change改变对象的值MouseOut鼠标指针离开某对象Click在对象上单击鼠标MouseOver鼠标指针悬停于某对象之上DblClick在对象上双击鼠标MouseUp放开鼠标左键DrogDrop拖拽对象Move窗口被移动时Error加载文件或图形时发生错误Resize窗口大小被改变KeyDown按下键盘上的任意键的瞬间Select选择某对象KeyPress按下键盘上的任意键时Submit单击表单上的Submit按钮KeyUp某键被按下后弹起来的瞬间Reset单击表单上的Reset按钮Load 浏览器读入文件时JavaScript的事件处理的事件处理2、事件处理程序语法、事件处理程序
27、语法 将事件处理程序直接嵌入HTML标记符中例如:浏览直接写在对象后面 document.onLoad=alert(这是事件处理程序);浏览 JavaScript的事件处理的事件处理3、应用举例、应用举例 例1:网络技术学习网 浏览JavaScript的事件处理的事件处理3、应用举例、应用举例例2请输入基本资料:姓名:浏览 JavaScript提供了一些非常有用的常用内部对象和方法。用户不需要用脚本来实现这些功能。这正是基于对象编程的真正目的。本节主要介绍JavaScript提供的Array(数组)、string(字符串)、math(数值计算)和Date(日期)内置对象。JavaScript内
28、置对象内置对象JavaScript内置对象内置对象1.数组数组(Array)对象对象格式:格式:对象名=new Array(元素个数)或 对象名=new Array(值1,值2,)例如:例如:fruit=new Array(2)声明了有2个元素的数组 fruit=new Array(“苹果”,”橘子”)声明了有2个 数组元素的数组,并赋值。属性:属性:index:数组元素的索引值。length:数组长度(数组元素个数)。方法:方法:join():将数组内的所有值组合成一个字符串,并用特定符号分开。toString():以字符串来表示数组和数组值。reverse():将数组内元素的索引次序翻转过
29、来 JavaScript内置对象内置对象2.字符串字符串(String)对象对象格式:格式:字符串变量名=“字符串常数”例如:例如:var str1=”JavaScript”/定义字符串变量属性:属性:length:字符串长度 方法:方法:包括字符串显示和运算两类方法包括字符串显示和运算两类方法举例:举例:例1:属性length测试 例2:indexOf()函数应用 例3:大、小写转换JavaScript内置对象内置对象字符串字符串(String)对象的常用方法对象的常用方法anchor、link创建书签链接,相当于,格式为String.anchor()创建超链接,相当于,格式为String.
30、link(URL)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:欧拉常量:欧拉常量,自然对数的底自然对数的底(
31、约等于约等于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()返回某数的绝对值返回某数的绝对值 acos()返回某数的反
32、余弦值返回某数的反余弦值(以弧度为单位以弧度为单位)asin()返回某数的反正弦值返回某数的反正弦值(以弧度为单位以弧度为单位)atan()返回某数的反正切值返回某数的反正切值(以弧度为单位以弧度为单位)ceil()返回大于或等于指定数的最小整数返回大于或等于指定数的最小整数 floor()与与ceil相反相反 max()返回两数间的较大值返回两数间的较大值 min()返回两数问的较小值返回两数问的较小值 pow()返回返回m的的n次方次方(其中其中,m为底为底,n为指数为指数)random()返回返回0和和1之间的一个伪随机数之间的一个伪随机数 round()返回某数四舍五入之后的整数返回某
33、数四舍五入之后的整数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.日期时间日期时间(Date)对象对象方法:getYear()返回年份值 getMonth()返回月份值 g
34、etDate()并返回日期 getDay()返回星期几 getHours()返回小时数 getMinutes()返回分钟数 getSeconds()返回秒数 getTime()返回完整的时间JavaScript内置对象内置对象4.日期时间日期时间(Date)对象对象方法:setDate()改变Date对象的日期 setHours()改变小时数 setMinutes()改变分钟数 setMonth()改变月份 setSeconds()改变秒数 setTime()改变完整的时间 setYear()改变年份JavaScript内置对象内置对象4.日期时间日期时间(Date)对象对象提示:月份数为(0
35、-11)日期数为(1-31)星期数为(0-6)小时数为(0-23)分钟数为(0-59)秒数为 (0-59)毫秒数为(0-999)JavaScript内置对象内置对象5.用户自定义对象用户自定义对象在实际应用应用中,JavaScript提供的内置对象往往不能满足用户的需求,因此,常常需要建立用户自定义对象。对象(Object)是一组经过组织的数据,在JavaScript中的每一个对象都有两个相关的成员,即属性(Property)和方法(Method)。建立自定义对象就是为对象定义属性和方法,其步骤是:1)写一个构造函数来定义对象类a)为对象类定义属性b)为对象类定义方法先将方法的名称放到对象的构
36、造函数中写一个函数来描述该对象方法的内容2)利用new创建对象实例(Object Instance)举例 JavaScript对象及其层次关系对象及其层次关系NavigatorPluginMineTypeWindowFrameDocumentLocationHistoryCookieAnchorAppletAreaFormImageLinkLayerCheckBoxRadioSubmitHiddenPasswardFileUploadTextTextareaSelectResetButtonOption1.功能:功能:顶层对象顶层对象,用来表示浏览器所打开的窗口。用来表示浏览器所打开的窗口。2
37、.格式格式指定窗口:指定窗口:窗口名窗口名.属性属性 窗口名窗口名.方法(参数群)方法(参数群)打开当前窗口的窗口:打开当前窗口的窗口:opener.属性属性 opener.方法(参数群)方法(参数群)框架中的顶级窗口:框架中的顶级窗口:top.属性属性 top.方法(参数群)方法(参数群)当前活动窗口:当前活动窗口:self.属性属性 self.方法(参数群)方法(参数群)例如:例如:win1.document.title=“广告窗口广告窗口”self.close()opener.document.forms0.user.value=“张永张永”窗口对象窗口对象(WINDOW)3.属性属性N
38、ame 窗口的名字。窗口的名字。closed 判断窗口是否已经被关闭,返回布尔值。判断窗口是否已经被关闭,返回布尔值。document 包含当前文档的信息,包含当前文档的信息,(该属性本身也是一个对象该属性本身也是一个对象)frames 窗口的框架对象数组窗口的框架对象数组,以数组索引值表示,以数组索引值表示,(该属性该属性本身也是一个对象本身也是一个对象)。history 当前窗口最近浏览过的网页当前窗口最近浏览过的网页(该属性本身也是一个对象该属性本身也是一个对象)。location 窗口所显示文档的完整窗口所显示文档的完整URL(该属性本身也是一个对该属性本身也是一个对象象)。lengt
39、h 窗口内的框架个数。窗口内的框架个数。opener 代表使用代表使用open打开当前窗口的脚本所在的窗口。打开当前窗口的脚本所在的窗口。self 代表当前窗口。代表当前窗口。top 代表当前框架的最顶层窗口。代表当前框架的最顶层窗口。窗口对象窗口对象(WINDOW)3.属性属性defaultStatus 缺省的状态栏信息。缺省的状态栏信息。status 状态栏中的信息。状态栏中的信息。scrollbars 浏览器的滚动条(包括水平和垂直滚动条)。浏览器的滚动条(包括水平和垂直滚动条)。toolbar 浏览器的工具栏。浏览器的工具栏。menubar 浏览器的菜单栏。浏览器的菜单栏。locati
40、onbar 浏览器的地址栏。浏览器的地址栏。innerHeight 窗口内容区的高度(以像素表示)。窗口内容区的高度(以像素表示)。innerWidth 窗口内容区的宽度(以像素表示)。窗口内容区的宽度(以像素表示)。outerHeight 窗口边界的高度(以像素表示)。窗口边界的高度(以像素表示)。outerWidth 窗口边界的宽度(以像素表示)。窗口边界的宽度(以像素表示)。pageXOffset 网页网页x-position的位置(以像素表示)。的位置(以像素表示)。pageYOffset 网页网页y-position的位置(以像素表示)。的位置(以像素表示)。窗口对象窗口对象(WIN
41、DOW)4.方法方法open(URL,窗口名称,窗口名称,窗口规格,窗口规格)打开一个新窗口。打开一个新窗口。close()关闭窗口。关闭窗口。MoveBy(水平点数,垂直点数水平点数,垂直点数)MoveTo(x,y)将窗口移动至(将窗口移动至(x,y)坐标处,参数取绝对)坐标处,参数取绝对值。值。ResizeBy(水平点数,垂直点数水平点数,垂直点数)调整窗口大小(往右调整窗口大小(往右/往下)往下),参数取相对值。,参数取相对值。ResizeTo(宽度,高度宽度,高度)setTimeout(表达式,毫秒数表达式,毫秒数)等待一段指定的毫秒数时间等待一段指定的毫秒数时间,然后运行指令。然后运
42、行指令。clearTimeout(定时器对象定时器对象)清除清除 setTimeout定义的计时程定义的计时程序。序。窗口对象窗口对象(WINDOW)4.方法方法setInterval(表达式,毫秒数表达式,毫秒数)设置一个定时程序。设置一个定时程序。clearInterval(定时器对象定时器对象)清除清除 setInterval定义的计时器定义的计时器focus()将焦点移到此窗口。将焦点移到此窗口。blur()把焦点从指定窗口移开。把焦点从指定窗口移开。home()进入客户端在浏览器上设置的主页。进入客户端在浏览器上设置的主页。stop()停止加载网页内容。停止加载网页内容。back()
43、返回历史记录的上一个网页。返回历史记录的上一个网页。forward()加载历史记录的下一个网页。加载历史记录的下一个网页。alert(字符串字符串)传送警告信息。传送警告信息。confirm(字符串字符串)打开一个打开一个Confirm消息框消息框,用户可以选择用户可以选择OK或或Cancel,如果用户单击,如果用户单击OK,该方法返回该方法返回true,单击,单击Cancel返返回回false。prompt(“提示字符串提示字符串”,默认值,默认值)打开一个打开一个Prompt对话框对话框,用户可向该框键入文本用户可向该框键入文本,并把键入的文本返回到脚本。并把键入的文本返回到脚本。窗口对象
44、窗口对象(WINDOW)5.事件事件 onBlur onDragDrop onError onFocus onLoad onUnload onMove onResize 窗口对象窗口对象(WINDOW)1.单击单击“来者何人来者何人”,打开一,打开一200*100的窗口。的窗口。2.打开网页时,自动打开一打开网页时,自动打开一300*100的窗口。的窗口。作作 业业1.功能功能 它为它为window对象的一个属性对象的一个属性,用来存储客户端最近用来存储客户端最近访问过的网页清单。访问过的网页清单。2.格式格式history.属性属性history.方法(参数)方法(参数)3.属性属性leng
45、th 存储在记录清单中的网页数目。存储在记录清单中的网页数目。current 当前网页的地址。当前网页的地址。next 下一个历史记录的网页地址。下一个历史记录的网页地址。previous 上一个历史记录的网页地址。上一个历史记录的网页地址。历史对象历史对象(HISTORY)4.方法方法back 回到客户端查看过的上一页。回到客户端查看过的上一页。forward 回到客户端查看过的下一页。回到客户端查看过的下一页。go(整数或(整数或URL字符串)字符串)前往历史记录中的某个网前往历史记录中的某个网页页5.举例举例例:例:history对象实例对象实例历史对象历史对象(HISTORY)继续历史
46、对象历史对象(HISTORY)WIN1WIN2WIN3WIN4WIN5WIN6history.back()history.forward()history.go()返回1.功能功能代表特定窗口的代表特定窗口的URL信息。一个完整的信息。一个完整的URL格式如下:格式如下:protocol/host:port/path#hash?search其中其中 protocol:通信协议通信协议 host:主机名称主机名称 port:通信端口通信端口 path:文件路径文件路径 hash:定位锚点定位锚点 search:查询信息查询信息 位置对象位置对象(LOCATION)2.语法语法 location.
47、属性属性 location.方法(参数)方法(参数)3.属性属性 hash URL中定位锚点名称。中定位锚点名称。host URL中主机名部分。中主机名部分。hostname URL中中host:port部分。部分。href 完整的完整的URL字符串。字符串。pathname URL中中path部分。部分。port URL的的:端口端口port部分。部分。protocol URL的通信协议。的通信协议。search 以问号以问号(?)开始的开始的URL中的一部分中的一部分,用于指用于指定搜索信息。定搜索信息。位置对象位置对象(LOCATION)4.方法方法reload()重新加载(刷新)当前的
48、网页。重新加载(刷新)当前的网页。replace(网址网址)用特定的网页取代当前的网页。用特定的网页取代当前的网页。5.举例举例例例1:用普通文字实现超链接的范例用普通文字实现超链接的范例 例例2:自动打开网页范例自动打开网页范例 位置对象位置对象(LOCATION)每一个框架对象相当于窗口每一个框架对象相当于窗口(WINDOW)对象,对象,因此框架对象可以使用窗口对象的所有属性和方法。因此框架对象可以使用窗口对象的所有属性和方法。框架对象框架对象(FRAME)downFrameupFrameleftFrametoptopleftFrameupFramedownFrame1.框架组的结构框架组
49、的结构 2.框架组的层次框架组的层次 3.框架的引用框架的引用top.leftFrametop.upFrametop.downFrame或或top.frames0top.frames1top.frames24.举例举例框架对象框架对象(FRAME)文件对象文件对象(Document)代表当前的代表当前的HTML对象,是对象,是由由标记组构成的,标记组构成的,JavaScript自动为每一个自动为每一个HTML文件建立一个文件建立一个document对象,用来显示对象,用来显示HTML文件。文件。文档对象文档对象(DOCUMENT)1.语法语法 document.属性属性 document.方法
50、方法2.属性属性 link 文档中的一个文档中的一个标记标记(该属性本身也该属性本身也是一个对象是一个对象)。links 文件中的所有链接,以数组索引值表示。文件中的所有链接,以数组索引值表示。linkColor 文档的链接的颜色文档的链接的颜色,即即标记中的标记中的LINK属性。属性。alinkColor 活动链接的颜色活动链接的颜色(ALINK)。vlinkColor 指向已点击过的超链接文本颜色指向已点击过的超链接文本颜色,即即标记的标记的VLINK特性特性 forms 文件中的所有表单,以数组索引值表示。文件中的所有表单,以数组索引值表示。文档对象文档对象(DOCUMENT)2.属性属