JavaScript基础.ppt

《JavaScript基础.ppt》由会员分享，可在线阅读，更多相关《JavaScript基础.ppt（45页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、JavaScriptJavaScript基础基础什么是什么是JavaScript基础基础javascript诞生于1995年,当时它的主要目的就是处理以前由服务器语言负责的一些输入验证操作，在javascript问世之前,必须把表单里的数据发送到服务器才能确定用户是否没有填写某个必填域或者是输入信息是否正确。学习目标学习目标-认识变量（声明、规则、全局变量、局部变量）-数据类型（基本类型、引用类型）-运算符、表达式、控制语句第二讲：JavaScript基础第二讲：第二讲：2.1 变量变量变量 -JavaScript是一种弱类型的脚本语言 -var c=3：即变量的声明（变量使用之前必须加var

2、声明，编程规范）-变量的命名规则！1变量命名必须以字母或是下标符号”_”或者“$”为开头。2变量名长度不能超过255个字符 3变量名中不允许使用空格 4不能使用脚本语言中保留的关键字及保留符号作为变量名 5变量名区分大小写（javascript是区分大小写的语言）全局变量和局部变量全局变量和局部变量 -全局变量 在函数体外部声明的变量 函数内部，没有加var关键字声明的变量 -局部变量 方法内部，使用var声明的变量第二讲：第二讲：第二讲：第二讲：2.22.22.22.2数据类型数据类型数据类型数据类型ECMAScript中,数据类型也分为基本类型和引用类型两大类.基本数据类型：Number、

3、Boolean、String、Undefined、NullNumber：整数和小数(最高精度17位小数)、NaN、Infinity,-Infinity 注意：1.除10进制外，还可通过8进制和16进制的字面值来表示，如 070 表示56、0 xA表示10.Boolean：true和false.Undefined：表示变量声明但未赋值.Null:表示一个空的对象引用(也就是赋值为null)引用类型引用类型Object类型(比如对象、数组、RegExp、Date.)Typeof 操作符基本类型和引用类型的值基本类型是按照值访问的，因为可以操作保存在变量中的实际值引用类型则是按引用去访问的第二讲：第

4、二讲：2.3运算符运算符运算符与表达式：加减乘除、递增(+)、递减(-)、求余(%)变量的自动转换=等同符：不会发生类型的自动转化！=等值符：会发生类型自动转化、自动匹配！在程序中还经常使用到扩展赋值运算符，如：+=，-=，*=，/=，%=等说明说明符号符号加法加法+减法减法-乘法乘法*除法除法/增量增量+减量减量-取余取余%在复杂的表达式中往往会综合运用各种不同类型的运算符，而表达式的运算顺序有一定的规则：首先应按照运算符的优先次序从高到低的顺序，其次，优先级相同的运算符按照事先约定的结合方向（从左向右或从右向左）进行。条件表达式的基本的语法是：（条件表达式1）？表达式2：表达式3说明说明符

5、号符号相等相等=大于或等于大于或等于=大于大于不等不等!=小于或等于小于或等于=小于小于逻辑逻辑“与与”&逻辑逻辑“或或”|逻辑逻辑“非非”!第二讲：第二讲：第二讲：第二讲：2.4 2.4 控制语句控制语句控制语句控制语句基本上ECMAScript的控制语句和C一致if语句 if(条件)else if(条件).elseswitch 语句：switch(expression)case const1:语句块1.default:.for(初始化部分；条件部分；更新部分)语句块 while(条件)语句块 do 语句块 while(条件)break语句是结束当前的循环，并把程序的控制权交给循环的下一条语

6、句这里是结束循环，循环到此为止continue语句是结束当前的某一次循环，但是并没有跳出整个的循环。第二讲：第二讲：第二讲：第二讲：2.4 2.4 控制语句控制语句控制语句控制语句基本上ECMAScript的控制语句和C一致if语句 if(条件)else if(条件).elseswitch 语句：switch(expression)case const1:语句块1.default:.for(初始化部分；条件部分；更新部分)语句块 while(条件)语句块 do 语句块 while(条件)break语句是结束当前的循环，并把程序的控制权交给循环的下一条语句这里是结束循环，循环到此为止contin

7、ue语句是结束当前的某一次循环，但是并没有跳出整个的循环。学习目标学习目标-掌握数组的概念、特性、常用方法掌握数组的概念、特性、常用方法-掌握掌握ObjectObject，学会使用对象，学会使用对象-了解其他引用类型对象了解其他引用类型对象第三讲：数组第三讲：数组第三讲：第三讲：第三讲：第三讲：3.13.1 数组数组数组数组 在ECMAScript中数组是非常常用的引用类型了。ECMAScript所定义的数组和其他语言中的数组有着很大的区别。那么首先要说的就是数组也是一种对象。特点：“数组”即一组数据的集合。js数组更加类似java的容器。长度可变，元素类型也可以不同！数组长度随时可变！随时可

8、以修改！（length属性）常用方法：push、popshift、unshiftsplice、slice concat、join、sort、reverse、filter等第三讲：第三讲：第三讲：第三讲：3.23.2 ObjectObject 什么是对象，其实就是一种类型，即引用类型，而对象的值就是引用类型的实例。在ECMAScript中引用类型是一种数据结构，用于将数据和功能组织在一起。我们目前为止大多数引用类型都是Object类型的实例，Object也是ECMAScript中使用最多的一种类型（就像java.lang.Object一样，Object类型是所有它的实例的基础）。Object类型

9、的创建方式创建Object类型有两种，一种是使用new运算符，一种是字面量表示1.使用new运算符创建Object 2.使用字面量的方式创建Object var Student=new Object();var Student=Student.name=张三;name:张三,age:31;在实际开发过程中，我们更喜欢字面量的声明方式。因为它清晰，语法代码少，而且给人一种封装的感觉，字面量也是向函数传递大量可选参数的首选方式。对于Object类型应用for in 枚举循环 学习目标学习目标-了解函数的基本概念了解函数的基本概念-函数的定义方式函数的定义方式-函数的参数函数的参数-thisthis

10、第四讲：函数第四讲：函数第四讲：第四讲：第四讲：第四讲：4.14.1初识函数初识函数初识函数初识函数FunctionFunction类型，即函数的类型。类型，即函数的类型。一个典型的一个典型的JavaScriptJavaScript函数定义如下：函数定义如下：function function 函数名称（参数表）函数名称（参数表）函数执行部分：函数执行部分：注意：参数列表直接写形参名即可，不用写注意：参数列表直接写形参名即可，不用写var!var!returnreturn语句：语句：returnreturn返回函数的返回值并结束函数运行返回函数的返回值并结束函数运行 函数也可以看做数据来进行传

11、递函数也可以看做数据来进行传递第四讲：第四讲：第四讲：第四讲：4.4.2 2定义函数定义函数定义函数定义函数三种定义函数的方式：三种定义函数的方式：functionfunction语句形式语句形式函数直接量形式函数直接量形式通过通过FunctionFunction构造函数形式定义函数构造函数形式定义函数比较三种方式定义的区别比较三种方式定义的区别function语句Function构造函数函数直接量兼容完全js1.1以上js1.2以上版本形式句子表达式表达式名称有名匿名匿名性质静态动态静态解析时机优先解析顺序解析顺序解析作用域具有函数的作用域顶级函数(顶级作用域)具有函数作用域第四讲：第四讲：

12、第四讲：第四讲：4.4.3 3ArgumentsArguments对象对象对象对象ECMAScriptECMAScript函数不介意传递进来多少参数，也不会因为参数不统一而错误，实际函数不介意传递进来多少参数，也不会因为参数不统一而错误，实际上函数体内可以通过上函数体内可以通过argumentsarguments对象来接受传递进来的参数。对象来接受传递进来的参数。-arguments-arguments对象的对象的lengthlength属性可以得到参数的数量属性可以得到参数的数量PS:PS:我们可以利用我们可以利用lengthlength这个属性来智能判断有多少参数，然后把参数进行这个属性来

13、智能判断有多少参数，然后把参数进行合理的应用，比如，要实现一个加运算，将所有传进来的数字累加，而数字个数又合理的应用，比如，要实现一个加运算，将所有传进来的数字累加，而数字个数又不确定不确定第四讲：第四讲：第四讲：第四讲：4.4.3 3ArgumentsArguments对象对象对象对象ECMAScriptECMAScript函数不介意传递进来多少参数，也不会因为参数不统一而错误，实际函数不介意传递进来多少参数，也不会因为参数不统一而错误，实际上函数体内可以通过上函数体内可以通过argumentsarguments对象来接受传递进来的参数。对象来接受传递进来的参数。-arguments-arg

14、uments对象的对象的lengthlength属性可以得到参数的数量属性可以得到参数的数量PS:PS:我们可以利用我们可以利用lengthlength这个属性来智能判断有多少参数，然后把参数进行这个属性来智能判断有多少参数，然后把参数进行合理的应用，比如，要实现一个加运算，将所有传进来的数字累加，而数字个数又合理的应用，比如，要实现一个加运算，将所有传进来的数字累加，而数字个数又不确定不确定学习目标学习目标-什么是正则表达式什么是正则表达式-创建正则表达式创建正则表达式-获取控制获取控制-常用的正则常用的正则第五讲：正则表达式第五讲：正则表达式第五讲：第五讲：第五讲：第五讲：5.15.1正则

15、表达式正则表达式正则表达式正则表达式 什么是正则表达式什么是正则表达式 正则表达式正则表达式(regular expression)(regular expression)是一个描述字符模式的对象，是一个描述字符模式的对象，ECMAScriptECMAScript的的RegExpRegExp类表示正则表达式，而类表示正则表达式，而StringString和和RegExpRegExp都定义了使用正则表达式进行强大都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数。的模式匹配和文本检索与替换的函数。正则表达式主要用来验证客户端的输入数据，用户填完表单单击按钮之后，表单正则表达式主要用来

16、验证客户端的输入数据，用户填完表单单击按钮之后，表单就会被发送到服务器，在服务器端通常会用就会被发送到服务器，在服务器端通常会用PHPPHP，ASP.NET ASP.NET 等服务器脚本对其进行等服务器脚本对其进行进一步处理，可以节约大量的服务器端的系统资源，并且提供更好的用户体验。进一步处理，可以节约大量的服务器端的系统资源，并且提供更好的用户体验。创建正则表达式创建正则表达式 创建正则表达式和创建字符串类似，创建正则表达式提供了两种方法，一种事采创建正则表达式和创建字符串类似，创建正则表达式提供了两种方法，一种事采用用newnew运算符，另一种是采用字面量的方式。运算符，另一种是采用字面量

17、的方式。var Reg=new RegExp(hello);/var Reg=new RegExp(hello);/第一个参数字符串第一个参数字符串 var Reg=new RegExp(hello,gi);/var Reg=new RegExp(hello,gi);/第二个参数可选模式修饰符第二个参数可选模式修饰符 var Reg=/hello/;/var Reg=/hello/;/直接使用两个反斜杠直接使用两个反斜杠 var Reg=/hello/gi;/var Reg=/hello/gi;/在第二个斜杠后面加上模式修饰符在第二个斜杠后面加上模式修饰符参数参数含义含义i忽略大小写忽略大小写

18、g全局匹配全局匹配m多行匹配多行匹配第五讲：第五讲：第五讲：第五讲：5.2RegExp5.2RegExp对象的方法对象的方法对象的方法对象的方法 RegExpRegExp对象的方法对象的方法 RegExpRegExp对象包含两个方法，对象包含两个方法，test()test()和和exec(),exec(),功能基本相似，用于测试字符串匹配，功能基本相似，用于测试字符串匹配，testtest()()方法在字符串中查找是否存在指定的正则表达式并返回布尔值，如果存在则返回方法在字符串中查找是否存在指定的正则表达式并返回布尔值，如果存在则返回true,true,不存在则返回不存在则返回false.fa

19、lse.exec()exec()方法执行成功，则返回包含该查找字符串的相关信息数组，如果执行失方法执行成功，则返回包含该查找字符串的相关信息数组，如果执行失败，则返回败，则返回Null.Null.方法方法功能功能test在字符串中测试模式匹配，返回在字符串中测试模式匹配，返回true或或falseexec在字符串中执行匹配搜索，返回结果数组在字符串中执行匹配搜索，返回结果数组第五讲：第五讲：第五讲：第五讲：5.5 5.5 正则表达式元字符正则表达式元字符正则表达式元字符正则表达式元字符元字符元字符/元符号元符号匹配情况匹配情况x*匹配匹配0个或任意多个个或任意多个x?匹配匹配0个或一个个或一个

20、x+匹配至少一个匹配至少一个(xyz)+匹配至少一个匹配至少一个xyzxmin,max匹配至少匹配至少min至多至多max备选匹配符匹配符首部字符匹配首部字符匹配$尾部字符匹配尾部字符匹配s空白符空白符字符字符转换成原有的意思成原有的意思第五讲：第五讲：第五讲：第五讲：5.5 5.5 正则表达式元字符正则表达式元字符正则表达式元字符正则表达式元字符元字符元字符/元符号元符号匹配情况匹配情况.匹配除换行符已外的所有字符匹配除换行符已外的所有字符a-zA-Z匹配括号中的字符集中的任意字匹配括号中的字符集中的任意字a-z0-9匹配任意不在括号中的字符集中的字符匹配任意不在括号中的字符集中的字符 d匹

21、配数字匹配数字D匹配非数字匹配非数字w匹配字母及数字匹配字母及数字W匹配非字母及数字匹配非字母及数字s匹配一个空白符匹配一个空白符S匹配一个非空白符匹配一个非空白符u4e00-u9fa5匹配匹配汉字字简单的电子邮箱验证：简单的电子邮箱验证：var mail=/(w.-+)(w.-+).(w2,4)$/;var mail=/(w.-+)(w.-+).(w2,4)$/;第五讲：第五讲：第五讲：第五讲：5.4 5.4 正则表达式的静态属性正则表达式的静态属性正则表达式的静态属性正则表达式的静态属性属性属性短名短名含义含义Input$_当前被匹配的字符串当前被匹配的字符串LastMatch$&最后一个

22、匹配字符串最后一个匹配字符串LastPattern$+最后一最后一对圆括号内的匹配字符串括号内的匹配字符串LeftContext$最后一次匹配前的字符串最后一次匹配前的字符串multiline$*用于指定是否所有的表达式都用用于指定是否所有的表达式都用于多行的布于多行的布尔值rightContext&在上次匹配之后的子串在上次匹配之后的子串第五讲：第五讲：第五讲：第五讲：5.35.3字符串的正则表达式方法字符串的正则表达式方法字符串的正则表达式方法字符串的正则表达式方法 使用字符串的正则表达式方法使用字符串的正则表达式方法 除了除了test()test()和和execexec方法，方法，str

23、ingstring对象也提供了对象也提供了3 3个使用正则表达式的方法。个使用正则表达式的方法。方法方法功能功能match(RegExp)返回返回RegExp中的子串或中的子串或nullreplace(RegExp,replacement)用用replacement替换替换RegExpsearch(RegExp)返回字符串中返回字符串中RegExp开始位置开始位置学习目标学习目标-DOMDOM介绍介绍-查找元素查找元素-DOMDOM节点节点-节点操作节点操作第六讲：第六讲：DOMDOM基础基础第六讲：第六讲：第六讲：第六讲：6.16.1 DOMDOM基础基础基础基础 什么是什么是DOMDOM

24、DOM DOM（DocumentObjectModelDocumentObjectModel）即文档对象模型，针对）即文档对象模型，针对 HTML HTML 和和 XML XML 文档文档的的 API API（应（应 用程序接口）用程序接口）。DOM DOM 描绘了一个层次化的节点树，运行开发人员添加、描绘了一个层次化的节点树，运行开发人员添加、移除和修改页面的移除和修改页面的 某一部分。某一部分。DOM DOM 脱胎于脱胎于 Netscape Netscape 及微软公司创始的及微软公司创始的 DHTMLDHTML（动态（动态 HTML HTML），但现在它已），但现在它已 经成为表现和操作

25、页面标记的真正跨平台、经成为表现和操作页面标记的真正跨平台、语言中立的方式语言中立的方式 DOMDOM介绍介绍 DOM DOM 中的三个字母，中的三个字母，D D（文档）可以理解为整个（文档）可以理解为整个 Web Web 加载的网页文档；加载的网页文档；OO（对象）可（对象）可 以理解为类似以理解为类似 window window 对象之类的东西，可以调用属性和方法，这里我对象之类的东西，可以调用属性和方法，这里我们说的是们说的是 document document 对象；对象；MM（模型）可以理解为网页文档的树型结构。（模型）可以理解为网页文档的树型结构。节点节点 加载加载 HTML HT

26、ML 页面时，页面时，Web Web 浏览器生成一个树型结构，用来表示页面内部结构。浏览器生成一个树型结构，用来表示页面内部结构。DOM DOM 将将 这种树型结构理解为由节点组成这种树型结构理解为由节点组成 从上图的树型结构，我们理解几个概念，从上图的树型结构，我们理解几个概念，html html 标签没有父辈，没有兄弟，所以标签没有父辈，没有兄弟，所以 html html 标标 签为根标签。签为根标签。head head 标签是标签是 html html 子标签，子标签，meta meta 和和 title title 标签之间是兄弟关标签之间是兄弟关系。如果把每个标签当作一个节点的话，那

27、么这些节点组合成了一棵节点树。系。如果把每个标签当作一个节点的话，那么这些节点组合成了一棵节点树。htmlheadbodytitlemetah1pullilili第六讲：第六讲：第六讲：第六讲：6.26.2 DOMDOM基础基础基础基础 节点种类：节点种类：元素节点元素节点、文本节点文本节点、属性节点属性节点 查找元素查找元素 W3C W3C 提供了比较方便简单的定位节点的方法和属性，以便我们快速的对节点提供了比较方便简单的定位节点的方法和属性，以便我们快速的对节点进行操作。进行操作。方法方法说明说明getElementById()获取特定获取特定 ID 元素的节点元素的节点 getEleme

28、ntsByTagName()获取相同元素的节点列表获取相同元素的节点列表(数组数组)getElementsByName()获取相同名称的取相同名称的节点列表点列表(数数组）getAttribute()获取特定元素取特定元素节点属性的点属性的值 setAttribute()设置特定元素置特定元素节点属性的点属性的值 removeAttribute()移除特定元素移除特定元素节点属性点属性 当我们通过当我们通过 getElementById()getElementById()获取到特定元素节点时，这个节点对象就被我获取到特定元素节点时，这个节点对象就被我们获取到了，们获取到了，而通过这个节点对象，

29、我们可以访问它的一系列属性而通过这个节点对象，我们可以访问它的一系列属性 属性属性说明说明tagName获取元素节点的标签名获取元素节点的标签名 innerHTML获取元素节点里的内容，非获取元素节点里的内容，非 W3C DOM 规范规范id元素元素节点的点的 id 名称名称 title元素元素节点的点的 title 属性属性值 styleCSS 内内联样式属性式属性值 classNameCSS 元素的元素的类node node 节点属性节点属性 节点可以分为元素节点、属性节点和文本节点，而这些节点又有三个非常有用的属节点可以分为元素节点、属性节点和文本节点，而这些节点又有三个非常有用的属性，

30、性，分别为：分别为：nodeNamenodeName、nodeType nodeType 和和 nodeValue nodeValue。层次节点层次节点 节点的层次结构可以划分为：父节点与子节点、兄弟节点这两种。当我们获取节点的层次结构可以划分为：父节点与子节点、兄弟节点这两种。当我们获取其中一个其中一个 元素节点的时候，就可以使用层次节点属性来获取它相关层次的节点。元素节点的时候，就可以使用层次节点属性来获取它相关层次的节点。属性属性说明说明childNodes获取当前元素节点的所有子节点获取当前元素节点的所有子节点 firstChild获取当前元素节点的第一个子节点获取当前元素节点的第一个

31、子节点 lastChild获取当前元素取当前元素节点的最后一个子点的最后一个子节点点 ownerDocument获取取该节点的文档根点的文档根节点，相当与点，相当与 document previousSibling获取前一个取前一个节点点nextSibling获取后一个取后一个节点点parentNode获取当前取当前节点的父点的父节点点 attributes获取当前元素取当前元素节点的所有属性点的所有属性节点集合点集合第六讲：第六讲：第六讲：第六讲：6.4 6.4 节点操作节点操作节点操作节点操作方法方法说明说明write()这个方法可以把任意字符串插入到文档中这个方法可以把任意字符串插入到文

32、档中 createElement()创建一个元素节创建一个元素节点点 appendChild()将新将新节点追加到子点追加到子节点列表的末尾点列表的末尾 createTextNode()创建一个文本建一个文本节点点 insertBefore()将新将新节点插入在前面点插入在前面repalceChild()将新将新节点替点替换旧旧节点点cloneNode()复制复制节点点removeChild()移除移除节点点第七讲：第七讲：第七讲：第七讲：事件操作事件操作事件操作事件操作JavaScript JavaScript 事件模型：内联模型、脚本模型。事件模型：内联模型、脚本模型。内联模型内联模型 这

33、种模型是最传统接单的一种处理事件的方法。在内联模型中，事这种模型是最传统接单的一种处理事件的方法。在内联模型中，事件处理函数是件处理函数是 HTML HTML 标签的一个属性，用于处理指定事件。标签的一个属性，用于处理指定事件。input type=buttonvalue=/onclick=alert(Lee);/注意单双引注意单双引号号 脚本模型脚本模型 由于内联模型违反了由于内联模型违反了 HTML HTML 与与 JavaScript JavaScript 代码层次分离的原则。代码层次分离的原则。为了解决这个问题，我们可以在为了解决这个问题，我们可以在 JavaScript JavaSc

34、ript 中处理事件。这种处理方式就是中处理事件。这种处理方式就是脚本模型。脚本模型。varinput=document.getElementsByTagName(input)0;input.onclick=function()varinput=document.getElementsByTagName(input)0;input.onclick=function()/匿名函数执行匿名函数执行 alert(Lee);alert(Lee);第七讲：第七讲：第七讲：第七讲：事件处理函数事件处理函数事件处理函数事件处理函数JavaScript JavaScript 可以处理的事件类型为：鼠标事件、键

35、盘事件、可以处理的事件类型为：鼠标事件、键盘事件、HTML HTML 事件。事件。鼠标事件鼠标事件说明说明onclick当用户单击鼠标按钮或按下回车键时触发当用户单击鼠标按钮或按下回车键时触发 ondblclick当用户双击主鼠标按钮时触当用户双击主鼠标按钮时触发发 onmousedown当用当用户按下了鼠按下了鼠标还未未弹起起时触触发 onmouseup当用当用户释放鼠放鼠标按按钮时触触发 onmouseover当鼠当鼠标移到某个元素上方移到某个元素上方时触触发onmouseout当鼠当鼠标移出某个元素上方移出某个元素上方时触触发onmousemove当鼠当鼠标指指针在元素上移在元素上移动时

36、触触发第七讲：第七讲：第七讲：第七讲：事件处理函数事件处理函数事件处理函数事件处理函数键盘事件键盘事件键盘事件键盘事件说明说明onkeydown当用户按下键盘上任意键触发，如果按住不放，会当用户按下键盘上任意键触发，如果按住不放，会重复触发重复触发 onkeypress当用户按下键盘上的字符键触发，如果按住不放，当用户按下键盘上的字符键触发，如果按住不放，会重复触会重复触发发onkeyup当用当用户释放放键盘上的上的键触触发 第七讲：第七讲：第七讲：第七讲：事件处理函数事件处理函数事件处理函数事件处理函数HTML事件事件说明说明onload当页面完全加载后在当页面完全加载后在 window 上

37、面触发，或当框架集加载完上面触发，或当框架集加载完毕后在框架集上触发毕后在框架集上触发onselect当用当用户选择文本框文本框(input 或或 textarea)中的一个或多个字符触中的一个或多个字符触发onchange当文本框当文本框(input 或或 textarea)内容改内容改变且失去焦点后触且失去焦点后触发onfocus当当页面或者元素面或者元素获得焦点得焦点时在在 window 及相关元素上面触及相关元素上面触发onblur当当页面或元素失去焦点面或元素失去焦点时在在 window 及相关元素上触及相关元素上触发onsubmit当用当用户点点击提交按提交按钮在在元素上触元素上触

38、发onreset当用当用户点点击重置按重置按钮在在元素上触元素上触发onresize当窗口或框架的大小当窗口或框架的大小变化化时在在 window 或框架上触或框架上触发onscroll当用当用户滚动带滚动条的元素条的元素时触触发第七讲：第七讲：第七讲：第七讲：事件对象事件对象事件对象事件对象事件对象，我们一般称作为事件对象，我们一般称作为 event event 对象，这个对象是浏览器通过函数把这个对象作为参对象，这个对象是浏览器通过函数把这个对象作为参 数传递过来的。数传递过来的。获取事件对象的两种方式获取事件对象的两种方式/通过通过argumentsarguments获取获取input.

39、onclick=function()alert(arguments0);/MouseEventinput.onclick=function()alert(arguments0);/MouseEvent，鼠标事件对象，鼠标事件对象;/通过参数接收通过参数接收input.onclick=function(evt)input.onclick=function(evt)var e=evt|window.event;/var e=evt|window.event;/实现跨浏览器兼容获取实现跨浏览器兼容获取 event event 对象对象 alert(e);alert(e);第七讲：第七讲：第七讲：第七

40、讲：事件对象事件对象事件对象事件对象 eventevent的对象的属性的对象的属性属性属性说明说明button 0代表鼠标左键代表鼠标左键1代表滚轮按钮代表滚轮按钮2代表鼠标右键（兼容性不同值代表鼠标右键（兼容性不同值会发生改变）会发生改变）clientX可可视区区 X 坐坐标，距离左，距离左边框的位置框的位置clientY可可视区区 Y 坐坐标，距离上，距离上边框的位框的位screenX屏幕区屏幕区 X 坐坐标，距离左屏幕的位置，距离左屏幕的位置 screenY屏幕区屏幕区 Y 坐坐标，距离上屏幕的位置，距离上屏幕的位置shiftKey判断是否按下了判断是否按下了 Shfit 键 ctrlKey判断是否按下了判断是否按下了 ctrlKey 键 altKey判断是否按下了判断是否按下了 alt 键keyCode获取按取按键的的值THANK YOU结束结束