api - 事件

事件对象

   // 事件处理机制监听到用户操作之后，调用这个回调函数进行处理，同时给这个回调函数传入一个参数，这个参数就是事件对象
  btn.addEventListener('click', function(e) {   //这里设置的是e（一个形参）
    console.log(e)
  })

事件流

事件流：
    过程: 事件捕获 => 事件目标阶段 => 事件冒泡  整个完整的过程就是事件流

事件流图片

事件捕获
    概念: 从DOM的根元素开始去执行对应的事件 (从外到里)
    DOM.addEventListener(事件类型, 事件处理函数, 是否使用捕获机制)  //默认是false-冒泡事件。传递true是捕获事件

事件冒泡
    概念: 当一个元素的事件被触发时，同样的事件将会在该元素的所有祖先元素中依次被触发。这一过程被称为事件冒泡
    
阻止事件冒泡：
    e.stopPropagation()        //阻止事件冒泡
    e.preventDefault()         //阻止链接的跳转、阻止表单域的提交
    
    例： a.addEventListener('click', function(e) {
            e.preventDefault() // 阻止默认行为
            console.log('我不要跳转')
          })

两种注册事件的区别：
    传统on注册（L0）
        同一个对象,后面注册的事件会覆盖前面注册(同一个事件)
        直接使用null覆盖偶就可以实现事件的解绑
        都是冒泡阶段执行的
    事件监听注册（L2）
        语法: addEventListener(事件类型, 事件处理函数, 是否使用捕获)
        后面注册的事件不会覆盖前面注册的事件(同一个事件)
        可以通过第三个参数去确定是在冒泡或者捕获阶段执行
        必须使用removeEventListener(事件类型, 事件处理函数, 获取捕获或者冒泡阶段)
        匿名函数无法被解绑