关于dom事件

1.DOM事件级别

DOM0 el.onclick=function(){}

DOM2 el.addEventListener('click',function(){},false)

DOM3 el.addEventListener('keyup',function(){},false)

//后面的boolean参数，默认为false,为true表示捕获阶段触发，为false表示冒泡阶段触发。

2.DOM事件流

 

 

3.Event对象常见应用

event.preventDefault()阻止默认事件

event.stopPropagation()阻止冒泡

//如果按钮同时注册两个click事件A和B,如果期望执行A后不要在触发B,则可以在A的执行函数中添加以下方法，可以阻止触发B

event.stopImmediatePropagation() 处理事件优先级

 // 当父类中有十个子类，每个子类都需要click事件响应时候，不需要使用for循环给每个子元素都绑定click事件，只需要给父类绑定click事件，然后获取event.target当前元素即可

event.currentTarget 当前绑定事件的元素

event.target 当前元素

4.自定义事件

应用场景：不同于普通的click事件，同时许多别处需要触发

var eve=new Event('testEvent')
var el=document.getElementById('test')
el.addEventListener('testEvent',function(){
console.log("123")
})
el.dispatchEvent(eve)