关于DOM事件： 1.DOM事件的级别： 简单来说就是一种标准，有0、2、3,三种级别。你会不会问咋没有1呢？事实上是有DOM1的只是其没有关于事件的一些规定。 DOM0：用onclick进行事件的绑定，并且只能是一个事件，多个事件的话会出现事件的覆盖------- element.onclick=function(){} DOM2:可以绑定多个事件，并且不会出现事件覆盖，事件都会按照顺序进行执行，同时增加了事件的冒泡和捕获（第三个参数false是冒泡，true是捕获），不过此处有兼容问题，IE9以上支持，IE678的话用attchEvent()------- element.addEventListener('click',function(){},false) element.attchEvent('onclick',function(){},false) 此处注意，在使用attchEvent的时候绑定事件的参数是onclick DOM3：增加了自定义事件，键盘事件，鼠标事件等事件类型。element.attchEvent('keyup',function(){},false) 2.DOM事件的模型 冒泡、捕获 关于DOM事件捕获的具体流程： window---->document---->html---->body---->父级元素---->子集元素---->目标元素 捕获是自上而下的，冒泡是从当前事件往上 这其中需要了解： 获取HTML元素的方法：document.documentElement` 捕获的相应流程与代码的定义顺序没有关系
//捕获 let ev = document.querySelector('#ev') window.addEventListener('click', function() { console.log('window'); }, true); document.addEventListener('click', function() { console.log('document'); }, true); document.documentElement.addEventListener('click', function() { console.log('html'); }, true); document.body.addEventListener('click', function() { console.log('body'); }, true); ev.addEventListener('click', function() { console.log('父级元素'); }, false) //冒泡 window.addEventListener('click', function() { console.log('window'); }, false); document.addEventListener('click', function() { console.log('document'); }, false); document.documentElement.addEventListener('click', function() { console.log('html'); }, false); document.body.addEventListener('click', function() { console.log('body'); }, false); ev.addEventListener('click', function() { console.log('父级元素'); }, false);3.关于Event对象的常见应用： 阻止默认行为：event.preventDefault() 阻止冒泡行为：event.stopPropagation() 事件相应优先级：event.stoplmmediatePropagation() 当前绑定事件：event.currentTarget() 事件委托：event.target() 4.自定义事件 customEvent：可以加参数 custome 二者用法相同
let eve = new Event('custome'); ev.addEventListener('custome',function(){ console.log('custome'); }) ev.dispatchEvent(eve) custome是事件名，ev是一个DOM节点，利用dispatchEvent这个API触发对象eve