JavaScript事件
事件是JavaScript与网页之间交互的桥梁，当事件触发后，可执行相应的JS代码执行相关操作。如，点击后翻页、鼠标拖动对话框、选中内容后弹出分享等等。
快速入门
事件是一种可被JavaScript侦测到的行为，包括页面加载、鼠标单击、滑过到某区域等。当JS侦测到这些行为，就会触发相应事件，之后我们再去“填空”完成想要执行的业务代码即可，完美的实现交互事件的处理。 在实现开发过程编写代码时，也并不是所有事件我们都需要用到的，我们应该根据项目需求，来绑定、监听我们所需要用到的事件即可。
事件绑定
JavaScript提供了3种绑定方式，分别为内联绑定、动态绑定和事件监听。
行内绑定
也有地方称内联绑定（一个东西，不用纠结），行内绑定是通过HTML标签属性设置实现的，如下：
和JS文件的行内引用同一概念，也是不推荐使用的
动态绑定
行内绑定是在HTML中通过设置标签属性方式直接行内处理的，动态绑定则解决了“分离”问题。在JS代码中，先获取到需要操作的DOM元素对象，再给其添加事件即可，如下：
html代码：
JavaScript代码：
var btn_click = document.getElementById('btn_click');
btn_click.onclick = function(){
alert("顶！");
}
事件监听
为了能给同一个DOM对象，添加多个事件处理的程序，事件监听概念出现，如下：
事件监听的处理程序一般是采用 callback(回调函数) 的方式（如上)。如果采用的非匿名的有名函数，一般在使用完后，可移除事件监听。
DOM对象.removeEventListener(type, callback);
早期版本浏览器（IE6~8）事件监听语法是 :
DOM对象.attachEvent(type, callback); // 添加
DOM对象.detachEvent(type, callback); // 移除
事件对象
当发生事件时，会产生一个事件对象event，这个对象中包含着所有与该事件相关的信息，比如此事件的类型，此事件的触发元素，如鼠标事件此对象会包括鼠标的位置，键盘事件此对象会包括按键值等相关信息。
属性：
var element = document.getElementById('btn_click');
element.onclick = function(event) {
// 此事件 类型
console.log(event.type); // click
// 此事件 的操作元素
console.log(event.target); // 在老版本的IE浏览器（IE8及以下）中，onclick对应函数的事件对象并不是通过函数参数传入，而是需要使用window.event获取的
方法：
| 名称 | 描述 |
|---|---|
| stopPropagation() | 阻止事件冒泡 |
| preventDefault() | 阻止默认事件行为 |
事件类型
页面事件
页面事件多用于页面完成加载后，需即时执行的代码处理，如下：
| 事件名称 | 触发时机 |
|---|---|
| load | 当页面载入完毕后触发 |
| unload | 当页面关闭时触发 |
焦点事件
焦点事件多用于表单验证功能，是常用事件之一。如文本框获取焦点后改变样式，文本框失去焦点后及时验证文本框内数据等操作。如下：
| 事件名称 | 触发时机 |
|---|---|
| focus | 当获得焦点时触发 |
| blur | 当失去时触发 |
代码使用同页面事件同理，不做赘述
鼠标事件
鼠标事件应该是开发中最常见的一类事件了，如鼠标点击、滑过、拖拽等。
| 事件名称 | 触发时机 |
|---|---|
| click | 当按下并释放鼠标按键时触发 |
| dblclick | 当鼠标双击时触发 |
| mouseover | 当鼠标进入时触发 |
| mouseout | 当鼠标离开时触发 |
| change | 当内容发生改变时时触发，一般更多用于 select 对象 |
鼠标事件还有部分，如mousedown,mouseup,mousemove,mouseenter,mouseleave,mousewheel等等，要用时查下即可。
鼠标事件有一些常用的属性信息，一般是用来获取当前鼠标的位置信息，如下：
| 属性 | 描述 |
|---|---|
| clientX | 鼠标位于浏览器页面窗口的水平坐标 |
| clientY | 鼠标位于浏览器页面窗口的垂直坐标 |
| pageX | 鼠标位于文档的水平坐标 |
| pageY | 鼠标位于文档的垂直坐标 |
| screenX | 鼠标位于屏幕的水平坐标 |
| screenY | 鼠标位于屏幕的垂直坐标 |
键盘事件
当用户使用键盘进行操作时会触发相应的键盘事件，利用键盘事件可以实现一些常用的功能，如监听Enter按键进行表单的提交，监听Esc按键关闭展开的菜单等等，事件如下：
| 事件名称 | 触发时机 |
|---|---|
| keydown | 当按键按下时触发，长按触发多次 |
| keyup | 当释放按键弹起时触发 |
| keypress | 当按下按键时触发（Shift、CapsLock等非字符键除外） |
键盘事件常用事件属性值是 event.keyCode, 按键值是ASCLL码
ASCLL码表可自行查找， a(97),A(65),Entnt(13)
表单事件
表单事件是指对WEB表单操作时发生的事件，如表单提交前对表单数据验证等操作，如下：
| 事件名称 | 触发时机 |
|---|---|
| submit | 当表单提交时触发 |
| reset | 当表单重置时触发 |
关于事件流
事件冒泡
事件捕获
ＤＯＭ事件流规范
关于事件委托
同页面，大量元素需做事件处理，分别逐个添加必将占用大量资源，为优化效果，可进行事件委托处理。一般情况下，对父节点元素进行统一事件处理，之后通过事件对象的target属性进行元素判断，统一处理。