JS中的事件监听与事件流
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS中的事件监听与事件流相关的知识，希望对你有一定的参考价值。
事件监听：
使用监听器（eventListener）来预定事件，在传统软件工程中称成为观察者模式
执行某种操作时（特定的交互瞬间），会产生对象，对象会沿事件流的方向传播。
事件流:
事件流有两种顺序，事件捕获流以及事件冒泡流
事件捕获是从大到小，事件冒泡是从小到大。
<html> <body> <div> <a></a> </div> </body> </html>
如果你点了div，事件冒泡流的顺序就是div->body->html-document（理论上），
事件捕获流的顺序就是document->html->body->div（注意不会传到a，因为没
点到，如果只点击div你给a加上处理点击事件的处理程序，是不会触发a的处理程序的）
DOM2级事件
“DOM2级事件”规定的事件包括三个阶段：事件捕获阶段、处于目标阶段和事件冒泡阶段
事件处理程序
元素上定义属性
1.直接在HTML中定义
<a onclick="alert(‘zack‘);"></a>
2.在js中定义
element.onclick = function(){alert("zack");};
添加事件监听（addEventListener）
element.addEventListener("click", function(){alert("zack"), boolean}
这些事件处理程序的定义方法都属于事件监听，将一个元素加入事件监听
element.addEventListener(),表示该元素对某个事件进行监听（订阅）
当事件发生时，该元素如果没有其他的影响，可以通过监听从事件流得到事件。
比如为上面的a元素添加对click事件的事件监听处理程序，当click发生且能够传播到a元素时，
就会对该事件做出相应的处理，处理程序不限于作用在a元素上
事件对象
事件对象event是一个全局对象，记录了事件发生的各种事情，当事件发生时，事件对象event会获得更新
未完待续
以上是关于JS中的事件监听与事件流的主要内容，如果未能解决你的问题，请参考以下文章
JS DOM基础 事件概述 事件流 事件处理方法 添加监听器 事件类型 事件对象 事件委托