JavaScript-筑基（十三）事件高级导读、注册事件概述

1. 掌握写出元素注册事件的两种方法
2. 能够说出删除事件的两种方式
3. 能够说出DOM事件流的三个阶段
4. 掌握利用事件对象完成跟踪鼠标案例
5. 掌握封装阻止冒泡的兼容性函数
6. 能够说出事件委托的原理
7. 能够说出常用的鼠标事件和键盘事件

学习的主要内容：

• 注册事件（绑定事件）
• 删除事件（解绑事件）
• DOM事件流
• 事件对象
• 阻止事件冒泡
• 事件委托（代理、委派）
• 常用的鼠标事件
• 常用的键盘事件

注册事件概述

两种方式：传统方式（前面学的）和方法监听注册方式

传统注册方式，利用on开头的事件onclick；<button οnclick= "alert('hi~')"></button>； btn.onclick =function(); 特点：同一个元素同一个事件只能设置一个处理函数，最后注册的处理函数将会覆盖前面注册的处理函数

方法监听注册事件方式

w3c标准 推荐方式；addEventListener（）它是一个方法；特点：同一个元素同一个事件可以注册多个监听器；按注册顺序依次进行；

eventTarget.addEventListener(type,listener[,useCapture])方法将指定到监听器注册到eventTarget（目标对象）上，当该对象触发指定事件时，就会执行事件处理函数。该方法接受三个参数：

• type:事件类型字符串，比如click、mouseover，注意这里不要带on
• listener：事件处理函数，事件发生时，会调用该监听函数
• useCapture:可选参数，是一个布尔值，默认是false。学完DOM事件流后，再进一步学习

<button>方法监听事件</button>
    <script >
       var btns = document.querySelector('button');
       btns.addEventListener('click',function() {
           alert('点击了');
       })
       btns.addEventListener('click',function() {
           alert('再弹出了');
       })//同一个元素 同一个事件可以添加多个侦听器（事件处理程序）
    </script>

---

越学越慢了，明天加油