3.9 JavaScript-事件

事件绑定

事件绑定的三要素
1.事件源：和谁做好约定
2.事件类型：约定一个什么行为
3.事件处理函数：当用户触发该行为的时候，执行什么代码
语法：
事件源.on事件类型 = 事件处理函数
例：

事件类型

事件对象

概念：当事件触发的时候，一个描述该事件信息的对象数据类型


例：当事件被触发时，浏览器会自动传递出本次的事件对象

事件对象内的信息 - 鼠标事件

坐标信息：
1.offsetX 和 offsetY
2.clientX 和 clientY
3.pageX 和 pageY



例：鼠标点击时获得当前鼠标的坐标

事件对象内的信息 - 键盘事件

键盘编码 事件对象.keyCode
事件对象.key
例：获得当前键盘按下的值

keyCode对应的ASCLL编码值

事件传播

概念：浏览器响应事件的机制
浏览器窗口最先知道事件的发生
==捕获阶段：==从window按照结构子级的顺序传递 目标
==目标阶段：==准确触发事件的元素接收到行为
==冒泡阶段：==从 目标 按照结构父级的顺序传递到window
本次事件传播结束

例：

阻止事件传播

因为事件传播当在子级身上触发事件的时候，也同时会触发父级的事件，因此我们要阻止事件传播
语法：事件对象.stopPropagation()

事件委托

概念：利用事件冒泡机制，把自己的事件委托给结构父级中的某一层

例：

事件对象内的信息 -表单事件

阻止默认事件

在js中有很多元素都有默认行为 比如 a标签跳转 提交按钮 重置按钮 等 如果不需要元素的默认行为 可以被阻止，利用事件参数 来进行阻止