版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、JavaScript学习教程,主要内容 概述 编程基础 事件驱动 内置对象 浏览器对象,JavaScript是由网景公司开发的一种跨平台,面向对象(object-oriented)的网页脚本语言(Web Script Language),是目前流行的网页特效设计语言。 JavaScript代码可直接嵌入HTML文件中,随网页一起传送到客户端浏览器,然后通过浏览器来解释执行。,JavaScript概述,什么是JavaScript脚本语言? (1) 脚本语言(Scripting Language)? 由ASCII码构成,可直接用任何的文本编辑器开发完成。是一种不必事先编译,只要利用适当的解释器(I
2、nterpreter)就可以执行的简单的解释式程序。 (2) JavaScript? JavaScript是由网景公司开发的一种跨平台,纯面向对象(object-oriented)式的网页式脚本语言(Web Script Language)。JavaScript代码可直接嵌入HTML文件中,随网页一起传送到客户端浏览器,然后通过浏览器的解释器来解释执行。,JavaScript概述,脚本编写语言 基于对象的语言 简单性 安全性 动态性 跨平台,2. JavaScript的特点,JavaScript概述,制作网页特效 提供表单前端验证 窗口动态操作 提高系统工作效率,3. JavaScript的功
3、能,JavaScript概述,在HTML标记中直接写入JavaScript代码 例: 鼠标移过来 ,4. 在HTML文档中嵌入JavaScript代码,JavaScript概述,将JavaScript代码放入标记符中 例如: document.write(欢迎您学习JavaScript!); ,4. 在HTML文档中嵌入JavaScript代码,JavaScript概述,将代码独立存储为以 .js 为扩展名的文件,利用SRC属性将该文件调入 例如: welcome.js文件内容如下: document.write(欢迎您学习JavaScript!);,4. 在HTML文档中嵌入JavaScri
4、pt代码,JavaScript概述,为避免某些浏览器不完全支持JavaScript,而造成错误,可将JavaScript代码用注释语句括起来 例如: ,4. 在HTML文档中嵌入JavaScript代码,JavaScript概述,数值(Number):包含整数或浮点数。 逻辑值(Logical):取值为true或false。 字符串(String):用单引号或双引号括起来的零个或多个单一的字符所组成。 空值(null):表示没有值,取唯一值”null”,大小写敏感。 未定义值(undefined):表示尚未定义值。 注:null不能写成Null或NULL。 null既不等于“0”,也不等于“空
5、字符串”。因为“0”是数值,“空字符串”是字符串。,1. 数据类型,JavaScript编程基础,自动数据类型转换 如果表达式中用(+)运算符,且其中一个操作数为字符串,另一个操作数为数值时,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编程
6、基础,数据类型转换函数 eval(字符串):将传入的字符串参数内容,转换成相应的数值,例如: y=eval(“15”)+8; 结果:y=23 parseInt(字符串,底数):将传入的字符串,转换成指定底数的数值。 parseFloat(字符串):将传入的字符串,转换成浮点数值。,2. 数据类型转换,JavaScript编程基础,3. 变量,JavaScript编程基础,变量命名 以字母或下划线开头(不能以数字开头),后面接数字或其它字母。 变量名区分大小写。 例: var A=Uppercase A; var a=Lowercase a; document.write(A); documen
7、t.write(); document.write(a); ,3. 变量,JavaScript编程基础,变量的声明 变量声明时,不必定义类型,所有类型均由小写的var声明。 例如: var name; (JavaScript自动给出一个未定义值) var name,sex; (JavaScript自动给出一个未定义值) var name=”张永”,sex=”女生”; (二变量均为字符串),3. 变量,JavaScript编程基础,变量的作用域:全局变量(Global variable)和局部变量(Local variable)。 document.title = 变量的作用域实例; var g
8、v = JavaScript; /gv是全局变量 document.write(test函数的输出:); test(); function test() var lv = VBScript; /lv是局部变量 document.write(gv= + gv + ); document.write(lv= + lv + + ); document.write(document的输出:); document.write(gv= + gv + ); document.write(lv= + lv + ); ,4. 常量,JavaScript编程基础,字符串常量(String Literals) 一般
9、字符串常量 特殊字符的字符串常量 布尔常量(Boolean Literals):true或false。 整数常量(Integers Literals) 浮点常量(Floating-Point Literals) 数组常量(Array Literals),5. 运算符与表达式,JavaScript编程基础,赋值运算符,5. 运算符与表达式,JavaScript编程基础,比较运算符,5. 运算符与表达式,JavaScript编程基础,算术运算符,5. 运算符与表达式,JavaScript编程基础,逻辑运算符 a while ( i 0 ) document.write(i = ,i ,); i-;
10、 ,6. 程序控制流程,JavaScript编程基础,循环结构,do 语句或语句组 while () var i = 5; do document.write(i = ,i ,); i-; while( i 0 ) ,6. 程序控制流程,JavaScript编程基础,循环结构,for ( 初始值;条件;增量 ) , for ( var i = 5; i 0; i- ) document.write(i = ,i ,); ,6. 程序控制流程,JavaScript编程基础,循环结构,for ( 变量 in 对象 ) ,6. 程序控制流程,JavaScript编程基础,循环结构,with ( )
11、, document.write (限时抢购物品:); document.write (ViewSonic 17 显示器。); document.write (EPSON 打印机。); , with (document) write (限时抢购物品:); write (ViewSonic 17 显示器。); write (EPSON 打印机。); ,6. 程序控制流程,JavaScript编程基础,注释语句,/ /* */,JavaScript包含两类函数: 系统函数 用户自定义函数,7. JavaScript函数,JavaScript编程基础,1) 编码函数 功能:将字符串中非文字、数字字符
12、(如 document.write(x 不是数值吗?,isNaN(x); document.write(y 不是数值吗?,isNaN(y); 执行结果: x 不是数值吗?false y 不是数值吗?true,JavaScript编程基础,5) 转成整数函数 功能:将各种进制的数值转成十进制整数值。 格式:parseInt(字符串,底数) 举例: / 二进位转成十进位 document.write(11012 = ,parseInt(1101, 2),10); / 十六进位转成十进位 document.write(BFFF16 = ,parseInt(BFFF, 16),10); ,JavaSc
13、ript编程基础,6) 转成浮点函数 功能:将字符串转成浮点数值。 格式: parseFloat(字符串) 举例: document.write(parseInt(3.123456), ); document.write(parseFloat(3.123456), ); ,JavaScript编程基础,7) 用户自定义函数,function 函数名(参数1,参数2,) return ,定义函数的注意事项: 易于识别 功能模块化 放置在程序开始部分,JavaScript编程基础,JavaScript的事件处理,主要内容 1、事件 (Event):鼠标或键盘的动作称为事件 。 2、事件驱动(Eve
14、nt Driver):由事件引发的一连串程序的动作,称为事件驱动。 3、事件处理程序(Event Handler):对事件进行处理的程序或函数。 4、事件处理程序语法,JavaScript的事件处理,1、常见事件,JavaScript的事件处理,2、事件处理程序语法 将事件处理程序直接嵌入HTML标记符中 例如: 直接写在对象后面 document.onLoad = alert(这是事件处理程序); ,JavaScript的事件处理,3、应用举例 例1: 网络技术学习网 ,JavaScript的事件处理,3、应用举例 例2 请输入基本资料: 姓名: ,JavaScript提供了一些非常有用的常
15、用内部对象和方法。用户不需要用脚本来实现这些功能。这正是基于对象编程的真正目的。本节主要介绍JavaScript提供的Array(数组)、string(字符串)、math(数值计算)和Date(日期)内置对象。,JavaScript内置对象,JavaScript内置对象,1. 数组(Array)对象 格式:对象名 = new Array(元素个数) 或 对象名 = new Array(值1,值2,) 例如:fruit=new Array(2) 声明了有2个元素的数组 fruit=new Array(“苹果”,”橘子”) 声明了有2个 数组元素的数组,并赋值。 属性:index:数组元素的索引值
16、。 length:数组长度(数组元素个数)。 方法:join():将数组内的所有值组合成一个字符串,并用特定符号分开。 toString():以字符串来表示数组和数组值。 reverse():将数组内元素的索引次序翻转过来,JavaScript内置对象,1. 数组(Array)对象,JavaScript内置对象,2. 字符串(String)对象 格式:字符串变量名 = “字符串常数” 例如:var str1=”JavaScript” /定义字符串变量 属性: length:字符串长度 方法:包括字符串显示和运算两类方法,JavaScript内置对象,字符串(String)对象的常用方法,Jav
17、aScript内置对象,3. 数学(Math)对象 属性: E:欧拉常量,自然对数的底(约等于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() 返回某数的反余弦值(以弧度为单位) asin()
18、返回某数的反正弦值(以弧度为单位) atan() 返回某数的反正切值(以弧度为单位) ceil() 返回大于或等于指定数的最小整数 floor() 与ceil相反 max() 返回两数间的较大值 min() 返回两数问的较小值 pow() 返回m的n次方(其中,m为底,n为指数) random() 返回0和1之间的一个伪随机数 round() 返回某数四舍五入之后的整数,JavaScript内置对象,4. 日期时间(Date)对象 格式: 对象名 = new Date ( 日期参数 ) 举例: today = new Date () /以当日时间为对象初值。 today = new Date
19、(“October 1,2002 12:00:00”) / 以英文表示月份,其余以数值表示,即【月日,年时:分:秒】。 today = new Date (“2002,08,07,0,0,0) 一律以数字表示,即【年,月,日,时,分,秒】。,JavaScript内置对象,4. 日期时间(Date)对象 方法: getYear()返回年份值 getMonth() 返回月份值 getDate() 并返回日期 getDay() 返回星期几 getHours() 返回小时数 getMinutes() 返回分钟数 getSeconds() 返回秒数 getTime() 返回完整的时间,JavaScrip
20、t内置对象,4. 日期时间(Date)对象 方法: setDate() 改变Date对象的日期 setHours() 改变小时数 setMinutes() 改变分钟数 setMonth() 改变月份 setSeconds() 改变秒数 setTime() 改变完整的时间 setYear() 改变年份,JavaScript内置对象,4. 日期时间(Date)对象 提示: 月份数为(0-11) 日期数为(1-31) 星期数为(0-6) 小时数为(0-23) 分钟数为(0-59) 秒数为 (0-59) 毫秒数为(0-999),JavaScript内置对象,5. 举例 例1:Date对象常用方法测试
21、例2:显示当天的时间 例3:显示用户的进站时间 例4:倒计时,JavaScript内置对象,5. 用户自定义对象 在实际应用应用中,JavaScript提供的内置对象往往不能满足用户的需求,因此,常常需要建立用户自定义对象。对象(Object)是一组经过组织的数据,在JavaScript中的每一个对象都有两个相关的成员,即属性(Property)和方法(Method)。建立自定义对象就是为对象定义属性和方法,其步骤是: 1)写一个构造函数来定义对象类 为对象类定义属性 为对象类定义方法 先将方法的名称放到对象的构造函数中 写一个函数来描述该对象方法的内容 2)利用new创建对象实例(Objec
22、t Instance),JavaScript内置对象,作业题 用户进入时,显示“欢迎您进入本网站!”;离开时,显示“谢谢您,欢迎下次再来!”。 答案: ,JavaScript对象及其层次关系,Window,Frame,Document,Location,History,Cookie,Anchor,Applet,Area,Form,Image,Link,Layer,CheckBox,Radio,Submit,Hidden,Passward,FileUpload,Text,Textarea,Select,Reset,Button,Option,1.功能:顶层对象,用来表示浏览器所打开的窗口。 2.
23、格式 指定窗口: 窗口名.属性 窗口名.方法(参数群) 打开当前窗口的窗口:opener.属性 opener.方法(参数群) 框架中的顶级窗口: top.属性 top.方法(参数群) 当前活动窗口: self.属性 self.方法(参数群) 例如:win1.document.title=“广告窗口” self.close() opener.document.forms0.user.value=“张永”,窗口对象(WINDOW),3.属性 Name 窗口的名字。 closed 判断窗口是否已经被关闭,返回布尔值。 document 包含当前文档的信息,(该属性本身也是一个对象) frames 窗
24、口的框架对象数组, 以数组索引值表示,(该属性本身也是一个对象)。 history 当前窗口最近浏览过的网页(该属性本身也是一个对象)。 location 窗口所显示文档的完整URL(该属性本身也是一个对象)。 length 窗口内的框架个数。 opener 代表使用open打开当前窗口的脚本所在的窗口。 self 代表当前窗口。 top 代表当前框架的最顶层窗口。,窗口对象(WINDOW),3.属性 defaultStatus 缺省的状态栏信息。 status 状态栏中的信息。 scrollbars 浏览器的滚动条(包括水平和垂直滚动条)。 toolbar 浏览器的工具栏。 menubar
25、浏览器的菜单栏。 locationbar 浏览器的地址栏。 innerHeight 窗口内容区的高度(以像素表示)。 innerWidth 窗口内容区的宽度(以像素表示)。 outerHeight 窗口边界的高度(以像素表示)。 outerWidth 窗口边界的宽度(以像素表示)。 pageXOffset 网页x-position的位置(以像素表示)。 pageYOffset 网页y-position的位置(以像素表示)。,窗口对象(WINDOW),4.方法 open(URL,窗口名称,窗口规格) 打开一个新窗口。 close() 关闭窗口。 MoveBy(水平点数,垂直点数) MoveTo(
26、x,y) 将窗口移动至(x,y)坐标处,参数取绝对值。 ResizeBy(水平点数,垂直点数) 调整窗口大小(往右/往下),参数取相对值。 ResizeTo(宽度,高度) setTimeout(表达式,毫秒数) 等待一段指定的毫秒数时间,然后运行指令。 clearTimeout(定时器对象) 清除 setTimeout定义的计时程序。,窗口对象(WINDOW),4.方法 setInterval(表达式,毫秒数) 设置一个定时程序。 clearInterval(定时器对象) 清除 setInterval定义的计时器 focus() 将焦点移到此窗口。 blur() 把焦点从指定窗口移开。 hom
27、e() 进入客户端在浏览器上设置的主页。 stop() 停止加载网页内容。 back() 返回历史记录的上一个网页。 forward() 加载历史记录的下一个网页。 alert(字符串) 传送警告信息。 confirm(字符串) 打开一个Confirm消息框,用户可以选择OK或Cancel,如果用户单击OK,该方法返回true,单击Cancel返回false。 prompt(“提示字符串”,默认值) 打开一个Prompt对话框,用户可向该框键入文本,并把键入的文本返回到脚本。,窗口对象(WINDOW),5.事件 onBlur onDragDrop onError onFocus onLoad
28、onUnload onMove onResize,窗口对象(WINDOW),1.功能 它为window对象的一个属性,用来存储客户端最近访问过的网页清单。 2.格式 history.属性 history.方法(参数) 3.属性 length 存储在记录清单中的网页数目。 current 当前网页的地址。 next 下一个历史记录的网页地址。 previous 上一个历史记录的网页地址。,历史对象(HISTORY),4.方法 back 回到客户端查看过的上一页。 forward 回到客户端查看过的下一页。 go(整数或URL字符串) 前往历史记录中的某个网页,历史对象(HISTORY),历史对象
29、(HISTORY),history.back(),history.forward(),history.go(),1.功能 代表特定窗口的URL信息。一个完整的URL格式如下: protocol / host:port / path # hash ? search 其中 protocol:通信协议 host:主机名称 port:通信端口 path:文件路径 hash:定位锚点 search:查询信息,位置对象(LOCATION),2.语法 location.属性 location.方法(参数) 3.属性 hash URL中定位锚点名称。 host URL中主机名部分。 hostname URL中
30、host:port部分。 href 完整的URL字符串。 pathname URL中path部分。 port URL的:端口port部分。 protocol URL的通信协议。 search 以问号(?)开始的URL中的一部分,用于指定搜索信息。,位置对象(LOCATION),4.方法 reload() 重新加载(刷新)当前的网页。 replace(网址) 用特定的网页取代当前的网页。,位置对象(LOCATION),每一个框架对象相当于窗口(WINDOW)对象,因此框架对象可以使用窗口对象的所有属性和方法。,框架对象(FRAME),1.框架组的结构,2.框架组的层次,3.框架的引用 top.l
31、eftFrame top. upFrame top. downFrame 或 top.frames0 top.frames1 top.frames2,框架对象(FRAME),文件对象(Document)代表当前的HTML对象,是由标记组构成的,JavaScript自动为每一个HTML文件建立一个document对象,用来显示HTML文件。,文档对象(DOCUMENT),1.语法 document.属性 document.方法 2.属性 link 文档中的一个标记(该属性本身也是一个对象)。 links 文件中的所有链接,以数组索引值表示。 linkColor 文档的链接的颜色,即标记中的LIN
32、K属性。 alinkColor 活动链接的颜色(ALINK)。 vlinkColor 指向已点击过的超链接文本颜色,即标记的VLINK特性 forms 文件中的所有表单,以数组索引值表示。,文档对象(DOCUMENT),2.属性 images 文档中所有image,以数组索引值表示。 anchors 文档中所有锚点,以数组索引值表示。 bgColor 文档的背景颜色(BGCOLOR)。 fgColor 文档中文本颜色(中的TEXT特性) cookie 存储于cookie.txt文件内的一段信息,它是该文档对象的一个属性 URL 表示该文件的网址。 title 文档的标题(TITLE)。 las
33、tModified 文档最后的修改日期。,文档对象(DOCUMENT),3.方法 write(字符串)将字符串或数值写到文件中。 getSelection() 取得当前选取的字符串。 4.事件 onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp,文档对象(DOCUMENT),当文档中包含标记时,JavaScript自动建立相对应的锚点对象。这些对象可以用document的anchors属性,搭配数组的索引方式来进行访问控制。例如:文件中的第一个锚点对象,叫做document. anchors 0, 第二个锚
34、点对象,叫做document. anchors 1,依次类推。,锚点对象(ANCHORS),1.语法 document.锚点名.属性 document.锚点名.方法 或 document.anchors.属性 document.anchors.方法 2.属性 name 表示锚点的名称。,锚点对象(ANCHORS),无论是文字、图形或图像映射,只要是用来作为超级链接用的对象,JavaScript自动建立相对应的链接对象。这些对象可以用document的links属性,搭配数组的索引方式来进行访问控制。例如:文件中的第一个链接对象,叫做document.links0, 第二个链接对象,叫做docu
35、ment.links1,依次类推。,链接对象(LINKS),1.语法 document.链接名.属性 document. 链接名.方法 或 document.links.属性 document.links.方法 2.属性 hash 表示URL字符串中锚点的名称。 host 表示主机域名或IP地址。 hostname 表示URL当中的host与port的部分。 href 完整的URL字符串。 pathname 表示URL当中的目录路径(path)部分。,链接对象(LINKS),2.属性 port 表示URL当中的通信端口(port)部分。 protocol 表示URL当中的通信协议部分 sear
36、ch 表示URL当中的查询字符串部分。 target 代表目标的窗口,即HTML中的TARGET属性 text 表示A标记中的文字。 3.事件 onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp、onMouseOut、onMouseDown,链接对象(LINKS),当文件中包含标记时,JavaScript自动建立相对应的图像对象。这些对象可以用document的images属性,搭配数组的索引方式来进行访问控制。例如:文件中的第一个图像对象,叫做document. images 0, 第二个图像对象,叫做d
37、ocument. images 1,依次类推。,图像对象(IMAGES),1.建立图像对象:new image(宽度,高度) 2.属性 src 图像的URL,SRC属性。 border 图像的边框,标记的BORDER属性。 width 图像的宽度,WIDTH属性。 height 图像的高度,HEIGHT属性。 hspace 图像水平空白,HSPACE属性。 vspace 图像垂直空白,VSPACE属性。 lowsrc 图像的第分辨率版本,LOWSRC属性。 complete 表示浏览器是否完成了图像的加载,一个布尔值。 3.事件:onAbort、onError、onLoad、onKeyDown
38、、onKeyPress、onKeyUp,图像对象(IMAGES),表单对象(Form)提供一个让客户端输入文字或进行选择的功能,例如:单选按钮、复选框、选择列表等。由标记组构成,JavaScript自动建立一个表单对象,并将用户端的信息送至服务器进行处理。表单对象是文件对象的子对象,同时,它也包含许多子对象。,表单对象(FORM),1.表单对象的使用格式 document.forms索引值.属性 document.forms索引值.方法(参数群) 或 document.表单名称.属性 document.表单名称.方法(参数群) 2.常用属性 Name:表单名,相当于标记的name属性 Acti
39、on:相当于标记的ACTION属性。 Method:输入窗体的数据传送到服务器上的方式,即(FORM)标记中的METHOD属性。 Elements:表单中的所有控件,以数组索引值表示 Length:表单中的控件的个数。,表单对象(FORM),2.常用属性 Checkbox:复选框,(该属性本身也是一个对象)。 Hidden:隐藏对象。 Button:按钮,(该属性本身也是一个对象)。 Radio:单选按钮,(该属性本身也是一个对象)。 Reset:复位按钮,(该属性自身也是一个对象)。 Submit:提交按钮,(该属性本身也是一个对象)。 Text:单行文本,(该属性本身也是一个对象)。 Te
40、xtarea:多行文本,(该属性本身也是一个对象)。 Select:选择框,(该属性本身也是一个对象)。,表单对象(FORM),3.常用方法 Submit() 提交表单(与Submit按钮的作用相同)。 reset() 重写表单(与使用reset按钮的作用相同)。,表单对象(FORM),表单对象(Form)提供一个让客户端输入文字或进行选择的功能,例如:单选按钮、复选框、选择列表等。由标记组构成,JavaScript自动建立一个表单对象,并将用户端的信息送至服务器进行处理。表单对象是文件对象的子对象,同时,它也包含许多子对象。,表单对象(FORM),1.表单对象的使用格式 document.f
41、orms索引值.属性 document.forms索引值.方法(参数群) 或 document.表单名称.属性 document.表单名称.方法(参数群) 2.常用属性 Name:表单名,相当于标记的name属性 Action:相当于标记的ACTION属性。 Method:输入窗体的数据传送到服务器上的方式,即(FORM)标记中的METHOD属性。 Elements:表单中的所有控件,以数组索引值表示 Length:表单中的控件的个数。,表单对象(FORM),2.常用属性 Checkbox:复选框,(该属性本身也是一个对象)。 Hidden:隐藏对象。 Button:按钮,(该属性本身也是一个
42、对象)。 Radio:单选按钮,(该属性本身也是一个对象)。 Reset:复位按钮,(该属性自身也是一个对象)。 Submit:提交按钮,(该属性本身也是一个对象)。 Text:单行文本,(该属性本身也是一个对象)。 Textarea:多行文本,(该属性本身也是一个对象)。 Select:选择框,(该属性本身也是一个对象)。,表单对象(FORM),3.常用方法 Submit() 提交表单(与Submit按钮的作用相同)。 reset() 重写表单(与使用reset按钮的作用相同)。,表单对象(FORM),当JavaScript读到标记中的type属性值为text时,自动建立一个文本按钮对象,并
43、将该对象放到表单对象的elements数组当中,让程序员可以通过一定的方法来控制这一对象。 1.使用文本对象的格式 document.forms索引值.elements索引值.属性 document.forms索引值.elements索引值.方法(参数群) 或 document.表单名称.文本对象名称.属性 document. 表单名称.文本对象名称.方法(参数群),单行文本对象,2.常用属性 defaultValue text对象的缺省值(VALUE属性初值) name text对象的名字(NAME属性) value text的当前值(VALUE属性值)。 form text所在的表单。 3
44、.常用方法 blur() 把焦点从文本框移开。 focus() 把焦点移到文本框。 select() 将该对象设置成选取状态。,单行文本对象,4.事件 onBlur、onChange、onFocus、onSelect、onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp、onMouseOut、onMouseDown、onMouseMove 5.举例 单行文本范例 姓名: ,单行文本对象,当JavaScript读到标记中的type属性值为password时,自动建立一个密码对象,并将该对象放到表单对象的elem
45、ents数组当中,让程序员可以通过一定的方法来控制这一对象。 其引用方法与单行文本相同。,密码对象,当JavaScript读到标记中的type属性值为button时,自动建立一个按钮对象,并将该对象放到表单对象的elements数组当中。 1.使用按钮对象的格式 document.forms索引值.elements索引值.属性 document.forms索引值.elements索引值.方法(参数群) 或 document.表单名称.按钮对象名称.属性 document. 表单名称. 按钮对象名称.方法(参数群),按钮对象,2.常用属性 name 按钮对象的名字(NAME属性) value 按
46、钮上显示的值。 form 按钮所在的表单。 3.常用方法 blur() 把焦点从该对象上移开。 focus() 把焦点移到该对象上。 click() 再该对象上单击鼠标左键。 4.事件 onBlur、onFocus、onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp、onMouseOut、onMouseDown、onMouseMove,按钮对象,当JavaScript读到标记中的type属性值为submit时,自动建立一个提交按钮对象,并将该对象放到表单对象的elements数组当中。 其用法语按钮对象相同
47、。,提交按钮对象,当JavaScript读到标记中的type属性值为reset时,自动建立一个重置按钮对象,并将该对象放到表单对象的elements数组当中。 其用法语按钮对象相同。,重置按钮对象,当JavaScript读到标记时,自动建立一个文本区域对象,并将该对象放到表单对象的elements数组当中。 1.使用文本对象的格式 document.forms索引值.elements索引值.属性 document.forms索引值.elements索引值.方法(参数群) 或 document.表单名称.文本区域对象名称.属性 document. 表单名称.文本区域对象名称.方法(参数群),多行
48、文本对象,2.属性 defaultValue 该对象的缺省值(VALUE属性初值)。 name 该对象的名字(NAME属性) value 该对象的当前值(VALUE属性值)。 form 该对象所在的表单。 3.方法 blur() 把焦点从文本框移开。 focus() 把焦点移到文本框。 select() 将该对象设置成选取状态。 4.事件 onBlur、onChange、onFocus、onSelect、onClick、onDblClick、onKeyDown、onKeyPress、onKeyUp、onMouseOver、onMouseUp、onMouseOut、onMouseDown、onM
49、ouseMove,多行文本对象,例:多行文本对象示例 document.title = 多行文本对象示例; function isTooLong(elm) if (elm.length 50) alert(留言内容太长,请修改后再发送.); return false; else meswin=open(,300,300); meswin.document.write(elm); 欢迎留言,不过请长话短说. ,多行文本对象,当JavaScript读到标记中的type属性值为radio时,自动建立一个单选按钮对象,并将该对象放到表单对象的elements数组当中。 1.使用按钮对象的格式 docu
50、ment.forms索引值.elements索引值.属性 document.forms索引值.elements索引值.方法(参数群) 或 document.表单名称.单选按钮对象名称.属性 document. 表单名称. 单选按钮对象名称.方法(参数群),单选按钮对象,2.属性 checked 设置该对象的选取状态,为一个布尔变量 defaultChecked 对应该对象的默认选取状态,为一个布尔变量。 name 按钮对象的名字(NAME属性) value 按钮的VALUE属性值。 form 按钮所在的表单。 3.方法 blur() 把焦点从该对象上移开。 focus() 把焦点移到该对象上。 click() 在该对象上单击鼠标左键。,单选按钮对象,4.事件 onBlur、onFocus、onClick、onDblC
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 建筑行业职业发展指南
- 煤炭委托合同2026年仓储服务
- 大庆二模试题及答案
- 胚胎学试题及详解
- 政治学与行政学题目及答案
- 集成电路测试题库及答案
- 医学影像CT诊断题库及答案
- 儿童心理发展题目及分析
- 化工企业可燃性粉尘清理制度
- 2026年审计师考试冲刺试卷黄金密押考前点题
- 2026年基金从业资格考试基金法律法规真题与答案
- 2026届高三英语二轮复习读后续写专题之修辞手法
- 中国邮政公司招聘笔试题库2026
- 2026年度省综合专家库评标专家继续教育培训试题及答案解析
- 2026四川成都市公共交通集团有限公司招聘储备人才等岗位备考题库含答案详解(突破训练)
- 2025西安建筑科技大学辅导员招聘考试真题
- 2026年宁波市水务环境集团校园招聘考试笔试试题及答案
- 2026年乡镇卫生院招聘考试题库及答案
- 无人机组装与调试职业技能等级标准
- 2026年岭南版小学二年级美术下册(全册)每课教学设计(附目录)
- 2026河北石家庄城市建设发展集团招聘10人备考题库及答案详解(新)
评论
0/150
提交评论