Dom事件级别
- Dom0---element.onclick=function(){}
- Dom2---element.addEventLister('click',funtion(){},'false')---true表示事件捕获，false表示事件冒泡
- Dom3---element.addEventListener('keyup,'function(){},'false')---Dom3其实是Dom2的基础上增加了一些事件，比如鼠标事件等，其实用法和Dom2相同
事件模型
- 捕获 --- 从window元素开始发生，一直到目标元素 （首先）
- 冒泡 --- 从目标元素开始发生，一直到window元素 （然后）
- 有监听函数就调用，并提供事件信息，没有就跳过
- Html标签需要通过document.documentElemnet来进行获取
疑问：那岂不是都调用两次？
答：其实不然，开发者可以自己选择把fn放在捕获阶段或者冒泡阶段（true(捕获)/falsy(冒泡)）
事件流
什么是事件流：就是在页面点击鼠标右键，这个右键如何反对应到页面上，这就是事件流。
## Dom事件捕获/冒泡的具体流程捕获：---window--document--html--body--...--目标元素
冒泡：反向
target和currenttargrt的区别
- e.target 用户操作的元素
- e.currenttarget 程序员监听的元素
- this是e.currentturget
举例
div>span{文字} 用户点击文字
span就是用户操作的元素 e.target
e.currenttarget就是div
特例：只有一个div被监听时（不考虑父子同时被监听）fn分别在捕获阶段和冒泡阶段监听click事件，用户点击元素就是开发者监听的
代码：
div.addEventLisenter('click',f1)
div.addEventLisenter('click',f2,true)
谁先监听谁先执行！！！
事件的特性
- e.stopPropagation() 取消冒泡
- Bubbles表示是否冒泡
- Cancelable 表示是否支持开发者取消冒泡（如scroll不支持取消冒泡）
- 禁用滚动（取消特定元素的wheel和touchstart的默认动作）
自定义事件
`var eve = new Event('costome') //注册事件
dom.addEventlistener('custome',function{
//绑定事件名称
console.log('我是自定义事件')
dom.dispatchEvent(eve) //通过dispatchEver
}) `
事件委托
事件委托，就是把事件委托给别的元素。不直接监听目标元素，而是监听目标元素的父级元素甚至更外层元素，把监听元素委托给父级元素甚至更外层元素，然后判断被点击的元素或他的子孙元素是不是目标元素，如果是就调用函数，不是就是跳过。
