第10章 JavaScript中的事件处理
- 格式:doc
- 大小:52.00 KB
- 文档页数:5
js 基础选择题1.以下哪个是 JavaScript 中的基本数据类型?A. StringB. ObjectC. ArrayD. Number正确答案是A, D。
JavaScript 中有七种基本数据类型:Number、String、Boolean、Null、Undefined、Symbol 和BigInt。
2.以下哪个是 JavaScript 中的函数声明方式?A. function() {}B. function name() {}C. function name(arg1, arg2) {}D. function name(arg1, arg2): returnType {}正确答案是C。
JavaScript 中的函数声明方式通常包括函数名称和参数列表。
如果函数没有返回值,则使用关键字"void"。
3.以下哪个是 JavaScript 中的事件处理程序?A. onclickB. onmouseoverC. onloadD. 以上都是正确答案是D。
JavaScript 中有许多事件处理程序,例如onclick、onmouseover、onload 等。
这些事件处理程序用于响应用户的交互行为。
4.以下哪个是 JavaScript 中的循环结构?A. forB. whileC. do-whileD. 以上都是正确答案是 D。
JavaScript 中有三种循环结构:for、while 和 do-while。
它们都可以用于重复执行一段代码,直到满足特定的条件为止。
5.以下哪个是 JavaScript 中的条件语句?A. ifB. else ifC. elseD. 以上都是正确答案是D。
JavaScript 中有三种条件语句:if、else if 和 else。
它们用于根据条件执行不同的代码块。
《Javscript实⽤教程》⽬录图书购买地址:京东:当当:天猫:注:本书提供课件,可向出版社索取。
⽬录Javascript实⽤教程 (1)⽬录 (2)第 1 部分 (12)◄ Javascript基础►. 12第 1 章 (13)◄ JavaScript 语法基础►. 131.1 基本概念和开发⼯具 (13)1.1.1 编程语⾔ (13)1.1.2 计算机语⾔ (13)1.1.3 编程语⾔ (13)1.1.4 翻译器 (14)1.1.5 编程语⾔和标记语⾔区别 (14)1.1.6 计算机基础 (14)1.1.7 浏览器 (16)1.1.8 ⽹页、⽹站和应⽤程序 (16)1.1.9 开发⼯具 (16)1.2 JavaScript 是什么 (18)1.2.1 JavaScript语⾔特点 (18)1.2.2 编译语⾔和脚本语⾔ (19)1.2.3 JavaScript应⽤场景 (19)1.2.4 JavaScript 与浏览器的关系 (20)1.2.5 JavaScript的组成 (20)1.3 初次体验JavaScript 代码 (21)1.3.1 JavaScript代码注意事项: (22)1.3.2 代码注释 (23)1.4 变量 (24)1.4.1 变量引⼊、声明和初始化 (24)1.4.2 变量在内存中的存储 (25)1.4.3 变量的命名规则和规范 (25)1.4 数据类型 (27)1.4.1 Number类型 (27)1.4.2 进制介绍(了解) (27)1.4.3 String类型 (30)1.4.4 Boolean类型 (32)1.4.5 Undefined和Null 321.4.6 数据类型转换 (32)1.4.8 获取变量的类型 (34)1.4.7 复杂数据类型 Object(对象) (35)1.5 运算符 (36)1.5.1 算术运算符 (36)1.5.2 ⼀元运算符 (36)1.5.3 逻辑运算符(布尔运算符) 371.5.4 关系运算符(⽐较运算符) 371.5.5 赋值运算符 (37)1.5.6 运算符的优先级 (37)第 2 章 (39)◄ JavaScript流程控制►. 392.1 顺序结构 (39)2.2 分⽀结构 (39)2.2.1 if语句 (39)2.2.2 三元运算符 (41)2.2.3 switch语句 (41)2.2.4 分⽀语句总结 (42)2.2.5 布尔类型的隐式转换 (43)2.3 循环结构 (43)2.3.1 while语句 (43)2.3.2 do...while语句 (44)2.3.3 for语句 (45)2.3.4 continue和break. 462.3 调试 (47)第 3 章 (48)◄数组、函数、作⽤域►. 483.1 数组 (48)3.1.1为什么要学习数组 (48)3.1.2 数组的概念 (48)3.1.3 数组的定义 (48)3.1.4 获取数组元素 (49)3.1.5 遍历数组 (50)3.1.6 数组中新增元素 (50)3.1.7 数组案例 (50)3.2 函数 (52)3.2.1 为什么要有函数 (52)3.2.2 什么是函数 (52)3.2.3 函数的定义 (53)3.2.4 函数的调⽤ (53)3.2.5 函数的参数 (54)3.2.6 函数的返回值 (55)3.2.7 arguments的使⽤ (56)3.2.8 匿名函数 (56)3.2.9 ⾃调⽤函数 (56)3.2.10 函数是⼀种数据类型 (57)3.3.1 全局变量和局部变量 (58)3.3.2 块级作⽤域 (59)3.3.3 词法作⽤域 (59)3.3.4 作⽤域链 (60)3.3.5 变量提升 (60)3.3.6 预解析 (61)第 4 章 (64)◄对象和内置对象►. 644.1 对象 (64)4.1.1 为什么要有对象 (64)4.1.2 什么是对象? (64)4.1.3 JavaScript中的对象 (65)4.1.4 对象创建⽅式 (65)4.1.5 属性和⽅法 (66)4.1.6 new关键字 (67)4.1.7 this详解 (67)4.1.8 对象操作 (68)4.1.8.1 遍历对象的属性 (68)4.1.8.2 删除对象的属性 (68)4.2 基本类型和复杂类型 (69)4.2.1 堆和栈 (69)4.2.2 值类型在内存中的存储 (69)4.2.3 引⽤类型在内存中的存储 (70)4.2.4 值类型作为函数的参数 (71)4.2.5 引⽤类型作为函数的参数 (72)4.3 内置对象 (73)4.3.1 Math对象 (73)4.3.2 Date对象 (74)4.3.3 Array对象 (76)4.3.4 基本包装类型 (79)4.3.5 String对象 (80)第 2 部分 (83)◄ Web API ►. 83Web API介绍 (83)API的概念 (83)Web API的概念 (83)JavaScript的组成 (83)第 5 章 (85)◄ BOM►. 855.1 BOM介绍 (85)5.1.1 BOM的概念 (85)5.1.2 BOM的顶级对象window.. 85 5.2 对话框 (87)5.2.1 alert() 875.2.2 prompt() 885.2 页⾯加载事件 (89)5.3 定时器 (89)5.4 location对象 (90)5.5 history对象 (93)5.6 navigator对象 (94)第 6 章 (97)◄ DOM和事件►. 976.1 DOM (97)6.1.1 DOM的概念 (97)6.1.2 模拟⽂档树结构 (98)6.2.3 DOM经常进⾏的操作 (99)6.2 事件 (101)6.2.1 事件的基本使⽤ (101)6.3 属性操作 (102)6.3.1 ⾮表单元素的属性 (102)6.3.2 innerText、textContent 1056.3.3 innerHTML和innerText的区别 (105)6.3.4 表单元素属性 (106)6.3.5 ⾃定义属性操作 (110)6.3.6 样式操作 (112)6.3.7 类名操作 (112)6.3.8 创建元素的三种⽅式 (114)6.4 节点操作 (116)6.4.1 节点的基本操作 (116)6.4.2 节点属性操作 (118)6.4.3 节点层级 (118)6.4.3.1 获取单个的⼦节点 (118)6.4.3.2 获取所有的⼦节点 (119)6.4.3.3 获取⽗节点 (119)6.5 事件详解 (121)6.5.1 注册/移除事件的三种⽅式 (121)6.5.2 事件冒泡 (123)6.5.3 事件的三个阶段 (125)6.5.4 事件对象的属性和⽅法 (127)6.5.4.1 事件句柄 (Event Handlers). 127 6.5.4.2 常⽤的⿏标和键盘属性 (128)6.5.4.3 event属性和⽅法总结 (129)6.5.4.4 案例 (130)6.6 偏移量 (132)6.6.1 offset系列:获取元素 (132)6.6.2 client系列可视区域 (134)6.6.3 滚动偏移:scroll系列 (135)6.7 综合案例 (136)6.7.1 轮播图 (136)6.7.2 固定导航栏 (142)◄ Javascript ⾼级►. 149第 7 章 (150)◄ JavaScript ⾯向对象编程►. 1507.1 ⾯向对象介绍 (150)7.2 创建对象的⽅式 (151)7.2.1 字⾯量的⽅式 (151)7.2.2 调⽤系统的构造函数 (152)7.2.3 ⾃定义构造函数⽅式 (152)7.2.4 ⼯⼚模式创建对象 (153)7.2.5 ⼯⼚模式和⾃定义构造函数创建对象的区别 (153)7.2.6 构造函数和对象的关系 (154)7.3 原型的引⼊ (155)7.4 ⾯向过程和⾯向对象 (156)7.5 构造函数、原型对象、实例对象之间的关系 (158)7.6 利⽤原型共享数据 (158)7.6.1 原型的简单语法 (158)7.6.2 原型中⽅法的使⽤ (159)7.6.3 内置对象的原型⽅法 (160)7.6.4 把局部变量变成全局变量 (161)7.7 原型及原型链 (162)7.7.1 原型指向可以改变 (162)7.7.2 实例对象属性和原型对象属性重名问题 (164)7.7.3 通过⼀个HTML的元素对象来查看原型链 (166)7.8 实现继承 (166)7.8.1 原型实现继承 (167)7.8.2 构造函数实现继承 (167)7.8.3 组合继承 (169)7.8.4 拷贝继承 (170)第 8 章 (172)◄函数进阶和其它►. 1728.1 函数的定义⽅式 (172)8.2 函数的调⽤⽅式 (173)8.2.1 函数内 this 指向的不同场景 (173)8.2.2 严格模式 (174)8.2.3 函数也是对象 (175)8.2.4 数组中函数的调⽤ (176)8.2.5 apply和call调⽤ (177)8.2.6 bind⽅法 (179)8.2.7 call、apply、bind的区别 (180)8.3 函数中⾃带的属性介绍 (180)8.4 函数作为参数使⽤ (181)8.3 函数作为返回值使⽤ (182)8.4 作⽤域和作⽤域链 (183)8.5 闭包 (184)8.8 浅拷贝和深拷贝 (188)8.9 递归案例 (191)8.9.1 遍历DOM树 (191)8.9.2 ⽣成菜单导航 (192)8.10 伪数组和数组 (194)8.11 JavaScript 垃圾回收机制 (196)8.11.1 可访问性(Reachability) (196)8.11.2 ⼀个简单⽰例 (196)8.11.3 两个引⽤ (197)8.11.4 相互引⽤的对象 (197)8.11.5 孤岛(Unreachable island) 199 8.11.6 内部算法 (200)第 9 章 (203)◄正则表达式►. 2039.1 正则表达式简介 (203)9.1.1 什么是正则表达式 (203)9.1.2 正则表达式的作⽤ (203)9.1.3 正则表达式的特点 (203)9.1.4 正则表达式的组成 (204)9.1.5 常⽤案例 (205)9.1.6 如何验证正则表达式的正确性 (206)9.1 JavaScript 中使⽤正则表达式 (206)9.1.1 创建正则对象 (206)9.1.2 正则匹配 (207)9.1.3 正则提取 (207)9.1.4 正则替换 (209)9.3 正则表达式使⽤案例 (210)9.3.1 密码强度验证 (210)9.3.2 表单验证 (214)第 10 章 (217)◄贪吃蛇案例►. 21710.1 ⽰例介绍 (217)10.2 实现步骤 (219)10.2.1 画地图和操作按钮 (219)10.2.2 封装⾷物对象 (220)10.2.3 封装⼩蛇对象 (222)10.2.4 封装游戏对象 (224)10.2.5 游戏调⽤ (227)第 4 部分 (228)◄ Javascript下⼀代标准►. 228第 11 章 (229)◄ ES6~ES10新特性介绍►. 22911.1 ES6新特性 (229)11.1.1 Arrows(箭头函数) (229)11.1.3 模板字符串 (230)11.1.4 函数的参数默认值 (230)11.1.5 延展操作符(Spread operator) 231 11.1.6 对象解构 (231)11.1.7 for...of 和 for...in. 23111.1.8 对象属性简写 (232)11.1.9 Promise. 23211.1.10 class(类) (235)11.1.11 Module (模块化) 23611.2 ES7新特性 (238)11.2.1 Array.prototype.includes() 23811.2.2 指数操作符**. 23811.3 ES8新特性 (238)11.3.1 async await 23911.3.2 Object.values/Object.entries. 241 11.3.3 padStart 和 padEnd. 24111.4 ES9新特性 (242)11.4.1 for await...of. 24211.4.2 Object Rest Spread. 24311.4.3 Promise.prototype.finally() 24511.4.4 新的正则表达式特性 (246)11.5 ES10新特性 (248)11.5.1 Array.prototype.flat() 24811.5.2 Array.prototype.flatMap() 24911.5.3 String.trimStart 和 String.trimEnd. 249 11.5.4 String.prototype.matchAll. 24911.5.5 修改 catch 绑定 (250)11.5.6 新的基本数据类型 BigInt. 25011.5.7 Object.fromEntries(). 25011.5.8 Symbol.prototype.description. 251 11.5.9 Function.prototype.toString() 251第 12 章 (252)◄ TypeScript简单介绍►. 25212.1 TypeScript简介 (252)12.1.1 安装TypeScript 25212.1.2 开始我们的第⼀个TypeScript程序 (253)12.1.3 类型注解 (255)12.1.4 接⼝ (255)12.1.5 类 (256)12.2 TypeScript基础类型 (257)12.2.1 元组 Tuple. 25712.2.2 枚举 (257)12.2.3 任意值any. 25812.2.4 空值 (259)12.2.5 Null 和 Undefined. 25912.2.7 类型断⾔ (259)参考⽂献 (261)。
Web前端进阶之JavaScript知到章节测试答案智慧树2023年最新济南大学第一章测试1.以下哪个选项是JavaScript的特点( )参考答案:具有以上各种特点2.编辑JavaScript程序时( )。
参考答案:可以使用任何一种文本编辑器3.下面的JavaScript语句书写正确的是()。
参考答案:null4.下面有关JavaScript说法错误的是()。
参考答案:可以在JavaScript 代码中使用双反斜杠对代码行进行换行。
5.下列选项中,有关JavaScript说法错误的是()。
参考答案:加入了JavaScript特效的页面,称为动态页面第二章测试1.在以上代码段中,哪些变量是全局变量?()参考答案:只有a2.以下描述中错误的是()。
参考答案:alert(typeof(function() {})) 显示的内容为:Function3.以下哪个语句打印出来的结果是false?()参考答案:alert(isNaN(true));4.JavaScript中, 以下声明变量的语句哪个不正确? ( )参考答案:null5.以下代码,哪个结果是正确的?var a='123.5abc' , b='100abc';6、 alert(parseInt(a)+Number(b)); ()参考答案:NaN6.以下哪个单词不属于javascript保留字?()参考答案:base7.要检测值是否为 NaN,应使用()函数。
参考答案:isNaN8.以下哪个变量名是非法的?( )参考答案:2sum9.(778>787)?5:2 的结果是( ) 。
参考答案:210.在 JavaScript 表达式中 12+"12"+"5"的结果是( )。
参考答案:1212511.分析 javascript 代码段,输出结果是var a="125.8765";c=parseInt(a);d=parseFloat(a);document.write(c+" "+d) ( )参考答案:125 125.876512.分析下面的 JavaScript 代码段,输出结果是a=eval("3+6+7");document.write(a); ( ) 。
《JavaScript 程序设计基础教程(第2版)》习题答案第一章Web 技术概述一、单选题1)D2)D3)D4)A5)C6)D7)C8)C9)D10)D11)A12)D13)D14)D15)A二、综合题(略)第二章HTML/XHTML 制作一、判断题1)对2)错3)对4)错5)对6)错7)错8)错9)错10)对11)对12)对13)错14)错15)对16)错17)对18)错19)错20)对21)错22)错二、单选题1)D2)C3)C4)B5)A6)B7)B8)B9)C10)C11)B12)C13)C14)C15)C16)C17)A三、综合题1)ex020301.htm2)ex020302.htm3)ex020303.htm4)ex020304.htm5)ex020305.htm6)ex020306.htm7)ex020307.htm8)ex020308.htm9)ex020309.htm10)ex020310.htm11)略第三章CSS 技术一、判断题1)错2)对3)错4)对5)错6)错7)对8)错9)对10)错11)对12)错13)错14)错15)错16)错17)错18)对19)对20)错21)错二、单选题1)B2)B3)A4)C5)B6)C7)A8)B9)D10)B11)D12)B13)A14)B15)D16)A17)B18)C19)B20)D21)B22)A23)D24)A三、综合题1)ex030301.htm2)ex030302.htm3)ex030303.htm4)ex030304.htm5)ex030305.htm6)ex030306.htm7)ex030307.htm8)ex030308.htm9)ex030309.htm10)ex030310.htm11)ex030311.htm12)ex030312.htm13)ex030313.htm14)ex030314.htm15)ex030315.htm16)略第四章JavaScript 编程基础一、判断题1)错JavaScript 是Microsoft公司设计的脚本语言。
JavaScript最新教案第一章:JavaScript简介1.1 JavaScript的概念与历史1.2 JavaScript的应用场景1.3 搭建开发环境1.4 编写第一个JavaScript程序第二章:JavaScript基础语法2.1 变量与数据类型2.2 运算符与表达式2.3 控制语句2.4 函数第三章:文档对象模型(DOM)3.1 DOM概述3.2 节点类型与层次结构3.3 选择器3.4 DOM操作第四章:事件处理4.1 事件概念4.2 事件处理程序4.3 事件流4.4 事件委托第五章:JavaScript高级特性5.1 闭包5.2 原型链5.3 异步编程5.4 ES6+新特性第六章:HTML DOM 扩展6.1 元素遍历与属性操作6.2 样式操作6.3 事件监听与触发6.4 动画与过渡第七章:JavaScript数组和字符串7.1 数组操作7.2 数组方法7.3 字符串操作7.4 字符串方法第八章:JavaScript对象和类8.1 创建对象8.2 对象属性访问8.3 对象方法8.4 类与继承第九章:错误处理和调试9.1 错误处理机制9.2 trycatch语句9.3 调试技巧与工具9.4 性能优化第十章:EcmaScript 6+(ES6+)新特性10.1 let和const10.2 箭头函数10.3 模板字符串10.4 解构赋值10.5 默认参数、扩展操作符10.6 Promise和async/awt第十一章:模块化和打包工具11.1 模块化概念11.2 CommonJS、AMD和ES6 Modules11.3 打包工具介绍(Webpack、Rollup、Parcel)11.4 配置和使用打包工具第十二章:前端框架和库12.1 React.js 简介12.2 Vue.js 简介12.3 Angular 简介12.4 框架比较和选择第十三章:前端工程化和自动化13.1 构建工具(Gulp、Grunt)13.2 代码质量保证(Linter、Formatter)13.3 版本控制(Git)13.4 持续集成和持续部署(CI/CD)第十四章:网络安全和数据保护14.1 跨站脚本攻击(XSS)14.2 跨站请求伪造(CSRF)14.3 数据加密与安全传输(S)14.4 用户隐私和数据保护法规(GDPR)第十五章:现代前端最佳实践15.1 代码风格和规范15.2 组件化和微前端15.3 性能优化策略15.4 响应式设计和移动端优化15.5 国际化与本地化这些章节将帮助学生了解现代前端开发的全面知识,包括模块化、打包工具、前端框架、工程化流程、网络安全以及最佳实践。
第10章 JavaScript中的事件处理JavaScript中的事件是浏览器响应用户操作的机制,其事件处理功能可以改变浏览器响应某些操作的标准方式,这样可开发出更具交互性、响应性和易用性的Web页面。
本章将介绍JavaScript中的事件处理。
其主要内容包括:事件处理的概念,常用的事件及处理、常用的简单消息输出函数以及错误处理等。
10.1 事件处理的基本概念事件是浏览器响应用户交互操作的一种机制。
浏览器本身有一套已经设计好的响应各种事件的方法,但用户有时需要开发应用程序,希望有一套机制可按需处理各种用户事件,这样就需要用到JavaScript 的事件处理机制。
JavaScript的事件处理机制可以改变浏览器响应用户操作的方法,这样就可开发出更具交互性的Web页面。
10.1.1 基本概念在JavaScript中,事件定义了用户与Web页面交互时的各种操作。
通常鼠标或键盘的动作就可称之为事件,而由鼠标或键盘引发的一连串程序的动作,称之为事件驱动。
对事件进行处理的程序或函数,称之为事件处理程序。
在JavaScript中对事件的处理通常由函数担任。
其基本格式与函数全部一样。
事件处理程序的格式一般如下所示:Function 事件处理名(参数表){事件处理语句集;……}利用JavaScript可以在用户端实现完整的数据处理和验证工作,这样可以节省网络的传输开销。
利用JavaScript实现交互功能的Web网页拥有以下3部分的内容。
(1)在head部分定义JavaScript函数,其中一些是事件处理函数,另外一些可能是为配合事件处理函数而编写的普通函数。
(2)HTML本身的各种格式控制标记。
(3)拥有句柄属性的HTML标记。
注意:句柄是界面对象的一个属性,可以存储特定事件处理函数的信息。
当事件发生时,JavaScript 自动查找界面对象中相应的事件句柄,调用注册在上面的事件处理函数。
一般句柄的形式总是在事件名称前加on,一个事件句柄不但可在HTML语言中注册,也可以使用JavaScript语句注册在一个界面对象上。
注意:事件句柄可以发生实际的用户事件时由浏览器调用,也可以在JavaScript中显式地调用。
·217·10.1.2 处理事件的程序在使用JavaScript语言开发事件处理程序时,必须使用的事件有以下3类:(1)自己引起的事件,如网页加载,提交表单等。
(2)引起页面之间跳转的事件,如超链接等。
(3)表单内部与界面对象的交互,包括界面对象的改变等。
一般情况下,指定事件处理程序有3种方法:(1)直接在HTML标记中指定。
方法是:<标记事件=”事件处理程序”[事件=”事件处理程序”……]>使用示例:<body onload=”alert(…请看网页‟)”onunload=”alert(…网页关闭‟)”>(2)编写特定对象特定事件的JavaScript。
方法是:<script language=”JavaScript”for=”对象” event=”事件”>事件处理程序的代码;……</script>使用示例:<script language=”JavaScript”for=”window” event=”onunload”>alert(…网页关闭‟);</script>(3)在JavaScript中说明。
方法是:<对象>.<事件>=<事件处理程序>;注意:事件处理程序如果是一个自定义函数,如不需要使用参数就不要加()。
使用示例:function error(){return true;}window.onerror=error; //不需要使用()10.2 常用的事件及处理JavaScript中有一些常用的事件,本节将详细讲解鼠标事件、键盘事件、窗口事件、图形事件以及浏览器事件等。
10.2.1 鼠标事件常用的鼠标事件有MouseDown、MouseMove、MouseUp,MouseOver、MouseOut、Click、Blur及Focus等事件。
1.MouseDownMouseDown事件是当按下鼠标的某个键时才发生的。
发生MouseDown事件后,JavaScript将自动调用onMouseDown句柄。
当MouseDown事件处理函数返回false值时,与鼠标操作有关的其他操作都会无效。
这些操作首先必须产生MouseDown事件。
2.MouseMove事件·218·MouseMove事件是在鼠标移动时发生的。
该事件发生后,JavaScript自动调用onMouseMove句柄。
只有当一个浏览器window对象或document对象要求捕获事件时,才在每次鼠标移动时产生。
3.MouseUp事件MouseUp事件是在释放鼠标上一个键时才发生。
该事件发生后,JavaScript自动调用onMouseUp句柄。
该事件可适用于普通按钮、网页及超链接等。
如果MouseUp事件处理函数返回false值,与鼠标操作相关的其他操作等都无效,这是由于这些操作首先必须产生MouseUp事件。
4.MouseOver事件MouseOver事件时在鼠标扫过一个界面对象时发生的。
当MouseOver事件发生后,JavaScript自动调用执行onMouseOver句柄。
5.MouseOut事件MouseOut事件时在鼠标脱离一个界面对象时发生的。
该事件发生后,JavaScript自动调用onMouseOut句柄。
一般情况下,该事件适用于区域、层及超链接对象。
6.Click事件一般情况下,Click事件可在两个地方发生。
首先,在一个表单上的某个对象被单击时发生;其次,在单击一个超链接时发生。
Click事件发生后,JavaScript将自动调用onClicek事件句柄。
onClick事件句柄适用于普通按钮、提交按钮、单选按钮、复选框及超链接等。
7.Blur事件该事件是在表单其他区域单击鼠标时发生。
即使当前对象的值没有改变,仍会触发onBlur事件。
Click事件发生后,JavaScript将自动调用执行onBlur事件句柄。
8.Focus事件Focus事件是在一个选择框、文本框或文本输入区域得到焦点时发生的。
当Click事件发生时,JavaScript自动调用onFocus事件句柄来执行。
用户可通过键盘上的Tab键或通过单击对象来得到焦点。
注意:onFocus句柄和onBlur句柄功能相反。
【示例10-1】鼠标事件10.2.2 键盘事件常用的键盘事件有KeyDown事件、KeyPress事件、KeyUp事件、Change事件、Select事件、Move 事件、Resize事件等。
1.KeyDown事件KeyDown事件是在键盘上按下一个键时发生的。
该事件发生后,JavaScript自动调用onKeyDown 句柄。
onKeyDown句柄适用于浏览器对象document、图像、超链接及文本区域等。
2.KeyPress事件KeyPress事件是在键盘上按下一个键时发生的。
该事件发生后,JavaScript自动调用onKeyPress句柄。
onKeyPress句柄适用于浏览器对象document、图像、超链接及文本区域等。
3.KeyUp事件KeyUp事件是在键盘上按下一个键时发生的。
该事件发生后,JavaScript自动调用onKeyUp句柄。
onKeyUp句柄使用于浏览器对象document、图像、超链接及文本区域等。
4.Change事件Change事件是在选择框、文本输入框或文本输入区域失去焦点,其中值又发生改变时发生的。
Change·219·事件发生时,JavaScript自动调用onChange句柄。
Change事件的典型应用是验证一个输入数据。
5.Select事件Select事件是在选定文本输入框或文本输入区域的一段文本之后发生的。
Select事件发生后,JavaScript将自动调用onSelect句柄。
onSelect句柄适用于文本输入框及文本输入区域。
6.Move事件Move事件是在用户或脚本程序移动一个窗口或帧时发生的。
该事件发生后,JavaScript自动调用onMove句柄。
该事件适用于窗口及帧。
7.Resize事件Resize事件是在用户或脚本程序移动一个窗口或一个帧时发生的。
该事件发生后,JavaScript自动调用onResize句柄。
该事件适用于浏览器对象document及帧。
10.2.3 窗口事件窗口事件主要用于包含文档主题和产生显示的普通HTML文档,也可用于将文档主体放在帧组中的布局文档。
常用的键盘事件有Load事件、Unload事件、Error事件、Focus事件、Blur事件。
1.Load事件Load事件是在装载窗口时发生的。
该事件发生后,JavaScript自动调用onLoad句柄。
Load事件常用于Java或插入件的Web页面,进行必要的初始化或播放语音文件、动画序列等。
2.Unload事件Unload事件主要在HTML页面退出窗口时发生的。
该事件发生后,JavaScript自动调用onUnload 句柄。
3.Error事件Error事件是在载入窗口时出错发生的。
该事件发生后,JavaScript自动调用onError句柄。
4.Focus事件Focus事件是在窗口得到输入焦点属性时发生的。
该事件发生后,JavaScript自动调用onFocus句柄。
5.Blur事件Blur事件是在窗口失去输入焦点属性时发生的。
该事件发生后,JavaScript自动调用onBlur句柄。
10.2.4 图形事件图形事件主要用于监视图形载入过程。
图形是Web页面中载入需要花费很长时间,所以要知道图形何时载入以及载入状态等。
常用的图像事件主要有Load事件,Abort事件,Error事件。
1.Load事件Load事件是当图形已经载入并显示时发生的。
该事件发生后,JavaScript自动调用onLoad句柄。
2.Abort事件Abort事件是当图形载入已经被用户打断时发生的。
该事件发生后,JavaScript自动调用onAbort句柄。
3.Error事件Error事件是当图形载入期出错时发生的。
该事件发生后,JavaScript自动调用onError句柄。
10.2.5 浏览器事件浏览器事件主要由Load事件、Unload事件及Submit组成。
·220·1.Load事件Load事件在浏览器完成一个窗口的装载之后发生的。
Load事件发生后,JavaScript自动调用onLoad 句柄执行。