DOM事件流

DOM 事件流 分为三个阶段

事件捕获 到达目标 事件冒泡
事件捕获阶段不会接收到事件，到body就结束了

捕获Document->html->body->div
冒泡div->body->html->Document

事件委托 addEventListener(事件名，事件处理函数，布尔值)
布尔值为true时 在捕获阶段调用事件处理程序
布尔值为false时 在冒泡阶段调用事件处理函数

DOM0 事件处理程序

// 绑定事件
btn.onclick=function(){
  // 执行对应操作
}
  // 移除事件
btn.onclick =null

DOM2 事件处理程序

let handler = function(){
  console.log('事件触发')
}
// 事件绑定
btn.addEventListener('click',handler,false)
// 事件移除
btn.removeEventListener('click',handler,false)

需要注意的是 addEventListener()添加的事件处理函数只能使用removeEventListener()并传入与添加时同样的参数来移除。
这意味着使用addEventListener()添加的匿名函数无法移除！

通过DOM0方式给一个元素绑定多个事件只会执行最后一个
而通过DOM2方式绑定的事件都会执行，
只有当绑定的事件名称，函数名，事件发生阶段都一样时，才会覆盖。