1. 什么是事件？
浏览器赋予元素天生默认的行为，不论是否绑定相关方法，只要行为操作进行了，就一定触发相关事件行为。
2. 什么是事件绑定？
给元素的某一个事件行为绑定方法，目的是行为触发可以做点自己想做的事情。
3. 事件绑定
包含DOM0事件绑定，DOM2事件绑定
- DOM0事件绑定
element.onxxx = function(){}
element.onxxx = null
只能给当前元素的某一个事件行为绑定一个方法（绑定多个也只识别最后一个）
- 只能给当前元素的某一个事件行为绑定一个方法（绑定多个也只识别最后一个）
原理：
给DOM元素对象的某一个私有事件属性赋值函数值，当触发这个时间行为，js引擎会把之前绑定的方法执行。
- DOM2事件绑定
element.addEventListener([事件类型]，[方法]，[传播模式])
element.removeEventListener([事件类型]，[方法]，[传播模式])
方法要单另写出来，只写方法名到事件绑定/移除中，否则移除监听时，因为函数存在两个堆内存中，而无法移除。
例如：
function text(){
console.log('ok')
}
element.addEventListener('click',text,false)
element.removeEventListener('click',text,false)
IE6-8：element.attachEvent('onxxx',[方法])
原理：
基于原型链查找机制，找到EventTarget.prototype上的addEventListener方法执行。它是基于浏览器事件池机制完成事件绑定。
DOM0级是直接获取自己私有事件属性，DOM2级是需要基于原型链层层查找，因此DOM0级性能要好于DOM2级。
事件池机制（事件队列Event Queue）
addEventListener向事件池不断添加内容，当触发元素的某个事件行为时，到事件池中查找，找到所有匹配的方法，然后按照存储顺序依次执行
- 可以给当前元素的某一个事件行为绑定多个不同方法（不存在重复情况）
- DOM0 和 DOM2 同时绑定click事件，DOM0先触发，DOM2后触发（依次）。
4. 事件对象
事件对象只和当前操作有关，和函数没有必然联系，它存储当前本次操作的相关信息，操作一次存一次，第二次操作替换前一次操作的信息。
element.addEventListener('click',function(ev){
console.log(ev)
})
鼠标常见事件对象
- clientX/clientY：当前鼠标触发点距离当前窗口左上角X/Y坐标
- pageX/pageY：触发点距离当前页面左上角X/Y坐标
- target：事件源，操作的那个元素。不兼容的浏览器中用srcElement
- preventDefault():阻止默认行为的方法，不兼容的浏览器中用ev.returnValue=fasle
- stopPropagation():阻止冒泡传播，不兼容的浏览器用ev.cancelBubble=true
5. 事件委托
利用事件的冒泡传播机制完成，即当前元素的某事件行为被触发，它祖先元素的相关事件行为都会被触发
举个栗子：
有一个大容器内有N个子元素，每个子元素在点击的时候都要做点事情。此时有两种方案：
- 方案一：给每个子元素的点击行为都绑定方法。
- 方案二：给容器的点击行为绑定方法，这样不管点击哪个子元素，容器的点击行为都会触发，这是我们只需要根据不同事件源（
ev.target），做不同的事情，这就是事件委托。（性能优于方案一）
