一、给一个对象绑定一个事件处理函数的形式
1、给一个对象绑定一个事件处理函数的第一种形式：
(1) 将一个函数赋值给一个事件处理程序属性，首先要取得一个要操作的对象的引用（obj）:
obj.onclick = fn;
(2) 当给一个对象的同一个事件绑定多个函数时：（后者会覆盖前者）
function fn1(){
alert(1);
}
function fn2(){
alert(2);
}
document.onclick = fn1;
document.onclick = fn2; // 会覆盖前面绑定的fn1
(3) 事件绑定形式的取消:
obj.onclick = null;
2、给一个对象的同一个事件绑定多个不同的函数，就要用到第二种形式：
给一个对象绑定一个事件处理函数的第二种形式是存在兼容问题的：
(1) ie : obj.attachEvent(事件名称,事件函数)
1、没有捕获
2、事件名称有on
3、事件函数执行的顺序：标准ie下-->正序；非标准ie下-->倒序
4、this指向window
解决方法：可以用函数下的一个方法call改变函数执行过程中的内部this的指向
document.attachEvent('onclick',function (){
fn1.call(document); // call方法第一个参数可以改变函数执行过程中的内部的this的指向，第二个参数开始就是原来函数的参数列表
// fn1() ==> fn1.call();
});
5、通过attachEvent()添加的事件处理函数都会被添加到冒泡阶段
6、ie下事件绑定形式的取消
obj.detachEvent(事件名称,事件函数)
7、匿名函数无法去除
(2) 标准 : obj.addEventLister(事件名称,事件函数,是否捕获)
1、有捕获
是否捕获：默认是false
false ：冒泡
true ：捕获
2、事件名称没有on
3、事件执行的顺序是正序的
4、this指向触发该事件的对象
5、标准下事件绑定形式的取消
obj.removeEventListener(事件名称,事件函数,是否捕获)
6、通过addEventLister()添加的匿名函数无法去除
7、给一个对象document的同一个事件click绑定两个函数fn1和fn2:
document.addEventListener('click',fn1,false);
document.addEventListener('click',fn2,false);
二、event对象
1、event : 事件对象，当一个事件发生的时候，和当前这个对象发生的这个事件有关的一些详细的信息都会被临时保存到一个指定地方- event对象，供我们在需要的时候调用
2、事件函数：事件调用的函数，一个函数是不是事件函数，不在定义的时候决定，而是取决于这个函数调用的时候
3、事件函数绑定：把一个函数赋值给某个事件，让他们之间产生关联，当这个事件发生的时候执行这个函数，我们称之为事件函数绑定
注：事件对象(event)必须在一个事件调用的函数里面使用才有内容
4、 兼容：
(1) ie/chrome : event是一个内置全局对象；
元素.事件 = function (){
alert(event); // 在ie和chrome是兼容的
}
(2) 标准下：事件对象是通过事件函数的第一个参数传入。如果一个函数是被事件调用的，那么这个函数定义的第一个参数就是事件对象
元素.事件 = function (ev){
alert(ev); // 非标准下，返回的是undefined
alert(ev.clientX); // clientX[Y]: 当一个事件发生的时候，鼠标到页面可视区的距离 ( X是X轴，Y是Y轴 )
}
5、解决兼容问题：
元素.事件 = function (ev){ // 传入第一个参数 ev
var ev = ev || event; // 用逻辑或来做判断
alert(ev); // 兼容问题解决
}
三、焦点事件：
1、焦点：使浏览器能够区分用户输入的对象，当一个元素有焦点的时候，那么他就可以接收用户的输入。
我们可以通过一些方式给元素设置焦点：
1、点击
2、tab键
3、js
注：不是所有的元素都能够接收焦点，能够响应用户操作的元素才有焦点
2、onfocus: 当元素获取到焦点的时候触发
onblur: 当元素失去焦点的时候触发
3、方法：
obj.focus(); 给指定的元素设置焦点；
obj.blur(); 取消指定元素的焦点；
obj.select(); 选择指定元素里面的文本内容（能够选中的内容只能是用户能够输入的内容）
四、键盘事件：
注：不是所有元素都能够接受键盘事件的，能够接受焦点的元素就能够接受键盘事件
1、onkeydown : 当键盘按键按下的时候触发。 如果按下不抬起，那么会连续触发
onkeyup : 当键盘按键抬起的时候触发
2、跟键盘事件有关的event下的属性：
event.keyCode : 数字类型 键盘按键的值（我们称之为键值）
每一个按键都有不同的值，相同功能的键值是一样的
ctrlKey,shiftKey,altKey 返回值：布尔值
当一个事件发生的时候，如果ctrl || shift || alt 是按下的状态，返回true，否则返回false
五、事件流 （事件流描述的是：从页面中接收事件的顺序）
1、事件冒泡
(1) 概念：即事件开始时由具体的元素（文档中嵌套层最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。
(2) 事件冒泡机制：当一个元素接收到事件的时候，会把他接收到的所有传播给他的父级，一直到顶层window，这种机制称之为事件冒泡机制
(3) 阻止冒泡：当前要阻止冒泡的事件函数中调用 event.cancelBubble = true;
2、事件捕获
(1) 概念：事件捕获的思想是不太具体的节点应该最早接收到事件，而具体的节点应该最后接收到事件。
(2) 事件捕获的用意在于 在事件到达预定目标之前捕获它
3、事件流的三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段
过程：首先发生的是事件捕获，为截获事件提供了机会；然后是实际的目标接收到事件；最后是冒泡阶段，可以在这个阶段对事件做出响应
注：实际的目标在捕获阶段不会接收事件；
冒泡阶段方法，事件又传播回文档
4、同时取消事件捕获和冒泡：event.stopPropagatioin();
六、设置全局捕获
1、 定义：当我们给一个元素设置全局捕获以后，那么这个元素就会监听后续发生的所有事件，当有事件发生的时候，就会被当前设置了全局捕获的元素所触发
2、 格式：元素.setCapture()
3、 释放全局捕获：元素.releaseCapture()
4、 setCapture()兼容问题：
a : ie : 有这个方法，并且有效果;
b : ff : 有这个方法，但是没有效果;
c ：chrome : 没有这个方法，浏览器会报错;
七、事件默认行为
1、当一个事件发生的时候，浏览器自己会默认做的事情。比如：
oncontextmenu : 右键菜单事件，当右键菜单（环境菜单）显示出来的时候触发
2、如何阻止事件默认行为？
当前这个行为是什么事件触发的，然后在这个事件的处理函数中使用：
return false； （非标准下）
event.preventDefault(); （标准下）
八、内存与性能
1、在使用事件时，存在的问题：
(1) 每个函数都是对象，都会占用内存，内存中的对象越多，性能就越差。因此，事件处理程序的数量直接关系到页面的整体运行性能。
(2) 每当事件处理程序指定给元素时，运行中的浏览器代码与支持页面交互的javaScript代码之间就会建立一个连接，连接越多，执行起来就越慢
2、解决其问题：
(1) 采用事件委托技术：事件委托是利用事件冒泡，只指定一个事件处理函数，就可管理某一类型的所有事件，从而限制页面中事件处理程序的数量。（所有用到按钮、鼠标和键盘事件的，都适合采用事件委托技术）
(2) 移除事件处理程序：
方法一：obj.事件 = null; // 移除事件处理程序
方法二：在页面卸载之前，先通过onunload事件处理程序移除所有事件处理程序。（onunload事件：在文档完全卸载后触发）