什么是“事件流”？
事件流描述的是从页面中接收事件的顺序
事件流的种类：
事件流主要分为三种
- 事件冒泡流(IE事件流)：事件开始时由最具体的元素(文档中嵌套最深的那个节点)接收，然后逐级向上传播到较为不具体的节点(文档)
- 事件捕获流(Netscape事件流)：不太具体的节点最先接收到事件，而最具体的节点应该最后接收到事件(在事件到达预定目标之前捕获到)
- DOM事件流：事件流包括三个阶段，事件捕获阶段，处于目标阶段，事件冒泡阶段。首先发生的是事件捕获，为截获事件提供了机会；然后是实际的目标接收事件；最后是冒泡阶段，可以在这个阶段对事件做出响应。
IE和DOM事件流的区别：
IE和DOM事件流的区别主要有四个方面不一样
- 执行的顺序不一样：事件俺的执行顺序不一样
案例为：
<body>
<div>
<button id = 'btn'>点击<button>
</div>
</body>三种事件流分别是：
冒泡型事件模型(IE事件流)： button->div->body
捕获型事件模型(Netscape事件流)： body->div->button
DOM事件模型： body->div->button->button->div->body (先捕获后冒泡)
- IE和DOM事件侦听函数的区别：
IE使用:
[Object].attachEvent("name_of_event_handler", fnHandler); //绑定函数
[Object].detachEvent("name_of_event_handler", fnHandler); //移除绑定
DOM使用：
[Object].addEventListener("name_of_event", fnHandler, bCapture); //绑定函数
[Object].removeEventListener("name_of_event", fnHandler, bCapture); //移除绑定
- 事件参数不一样和this指向不一样
如上的两个不一样的事件侦听函数：
attachEvent接受两个参数，第一个参数是事件名称，第二个fnHandler是回调处理函数
注意：IE下利用attachEvent注册的处理函数调用时this指向不再是先前注册事件的元素，这时的this为window对象了
addEventListener方法接受三个参数：
第一个参数是事件名称，值得注意的是，这里事件名称与IE的不同，事件名称是没’on’开头的;
第二个参数fnHandler是回调处理函数;
第三个参数注明该处理回调函数是在事件传递过程中的捕获阶段被调用还是冒泡阶段被调用
注意：它可以在一个DOM元素上绑定多个事件处理器，并且在处理函数内部，this关键字仍然指向被绑定的DOM元素，另外处理函数参数列表的第一个位置传递事件event对象
本面试题为前端常考面试题，后续有机会继续完善。我是歌谣，一个沉迷于故事的讲述者。
欢迎一起私信交流。
