科创学院Web应用开发课件第三章页面的客户端交互培训课件.pptVIP

3.2.3 DOM对象的事件 前面介绍了JavaScript对DOM顶级对象的基本操作，也包含了对HTML DOM对象的创建和修改操作，修改操作包括修改属性值（如innerHTML、innerText等）、修改样式（style属性）等操作。 实际上，在用户交互中，经常要对HTML DOM对象的事件进行处理，window对象还有一个event子对象，用于维护事件状态，如事件对象、鼠标、键盘的状态等。本部分仅介绍event对象的基本使用，更详尽的内容请参阅其他书籍。 3.2.3 DOM对象的事件 例3?12 event对象的使用 为window对象添加onmousemove、onkeypress、onclick事件，编写事件代码，然后在网页中添加几个HTML控件，并设置body的border样式. 为window添加onmousemove等事件，实际上为body元素生成了onmousemove等属性。onmousemove事件由用户在body中移动鼠标而产生，其处理函数代码中，使用event对象的x属性和y属性获取鼠标位置，将其显示在浏览器窗口状态栏上。onkeypress事件由用户按下并松开某个键盘按键而产生，其处理函数代码中，使用event对象的keyCode属性，将所按键的键码用警告框显示出来。onclick事件由用户对body的单击而产生，其处理函数代码中，使用event对象的srcElement属性，将单击的元素对象用警告框显示出来，默认显示元素对象的类型名称。 3.3 基本知识2：JavaScript脚本语言简介 3.3.1 概述 3.3.2 数据类型和变量 3.3.3 运算符、表达式、流程控制 3.3.4 函数 3.3.5 常用内置对象 3.3.1 概述 JavaScript是由Netscape公司开发的一种基于对象的网页脚本编程语言 1. JavaScript语言特点 JavaScript脚本语言也是类C语言，与C#语法有很多相似。 2. JavaScript脚本程序的使用 使用JavaScript脚本时，还要注意：函数中的脚本语句通常是由对象事件调用的，如果没发生相关事件，这些函数将不会运行；但脚本语句还可以不在任何函数中，它们将会随着文档的顺序加载，而被顺序运行。 3.3.2 数据类型和变量 JavaScript是弱类型语言，变量不必声明类型，但赋值后类型自动确定。 数据类型 字符串型、数值型、布尔型、对象型、null、undefined 2. 数据类型转换 （1）隐式转换 （2）强制转换 3. 变量 JavaScript的变量统一用“var”关键字声明，标识符命名规则与C#相近，大小写敏感，不再详述。 3.3.3 运算符、表达式、流程控制 1.JavaScript运算符 JavaScript的运算符与C#类似，也支持new操作符初始化对象、this操作符指代当前对象等，还支持delete操作符删除对象。不再详述。 2.JavaScript的流程控制 JavaScript的流程控制与C#类似，其中for语句的循环变量不包括类型声明，其他不再详述。 3.3.4 函数 全局函数 （1）eval 字符串 （2）parseInt 字符串 和parseFloat 字符串 ） （3）isNaN 表达式 （4）Boolean 对象 、Number 对象 、 String 对象 （5）escape 字符串 和unescape 字符串 2. 自定义函数 （1）函数定义 （2）函数的调用 ASP.NET网站开发技术 ASP.NET网站开发技术 ASP.NET网站开发技术 C#程序设计基础教程 C#程序设计基础教程 C#程序设计基础教程 ASP.NET网站开发技术 C#程序设计基础教程 C#程序设计基础教程 ASP.NET网站开发技术 C#程序设计基础教程 ASP.NET网站开发技术 C#程序设计基础教程 ASP.NET网站开发技术 C#程序设计基础教程 ASP.NET网站开发技术 C#程序设计基础教程 3.1 学习情境引入 3.2 基本知识1：文档对象模型DOM 3.3 基本知识2：JavaScript脚本语言简介 3.4 决策与计划 3.5 实施 3.1 学习情境引入 HTML和CSS都是客户端静态内容的设计技术，静态内容是网页设计的基础，但只有静态内容的网页无法完成丰富的交互功能。 3.1.1 客户端交互的功能需求 3.1.2 客户端交互的功能展示 3.1.3 客户端交互功能实现的技术分解 3.1.1 客户端交互的功能需求 网站与用户的交互，如果在服务器端实现，需要经过HTTP请求和响应，会使人感觉反应迟缓，用户体验较差。DHTML技术，