DOM 事件模型或 DOM 事件机制

面试中可能会遇到提问DOM事件模型或事件机制

我理解的DOM事件模型；

<div id="dv1">
  <div id="dv2">
    <div id="dv3">click</div>
  </div>
</div>

举例，click就是一个事件，后面可以绑定函数执行功能，事件可能在文档的任意部分中被触发,触发者可能是用户或者浏览器，事件不会仅在一处中触发或终止，是整个document中。触发时会参考W3C发布的标准先执行
祖先元素>父元素>子元素的顺序监听被称为事件捕获

e.addEventListener('click', fn) // 捕获

相反
子元素>父元素>祖先元素的顺序监听成为事件冒泡

e.attachEvent('onclick', fn) // 冒泡

W3C的最终标准

e.addEventListener('click', fn, bool)

bool 不传 或为 falsy 时，就让 fn 走冒泡，bool 为 true 时，就让 fn 走捕获，
如图，会按照先捕获再冒泡的顺序执行，在MDN中记载部分冒泡可以被阻止stopPropagation()（挂在冒泡顺序里的监听函数不被执行）部分不可阻止如：scroll