事件流顺序
事件流是网页元素接收事件的顺序，“DOM2级事件”规定的事件流包括三个阶段：
- 事件捕获阶段
- 处于目标阶段
- 事件冒泡阶段
首先发生事件捕获，为截获事件提供机会，然后是实际的目标接受事件，最后一个阶段是事件冒泡阶段，
事件捕获
const dom = document.getElementById('#main')
dom.addEventListener('click', (event) => {
console.log(event)
}, true)
如何组件事件捕获
function myEvent(event) {
event.stopImmediatePropagation()
}
事件冒泡
const dom = document.getElementById("#main")
dom.addEventListener('click', (event) => {
console.log(event)
}, false)
如何阻止事件冒泡
function myEvent(event) {
event.stopPropagation()
}
当容器元素及嵌套元素，即在捕获阶段又在冒泡阶段调用事件处理程序时：事件按dom事件流的顺序执行事件处理程序：
- 父级捕获
- 子级捕获
- 子级冒泡
- 父级冒泡
事件是如何实现的
基于发布订阅模式，就是在浏览器加载的时候会读取事件相关的代码，但是只有实际等到具体的事件触发的时候才执行
在web端，我们常见的就是DOM事件
- DOM0级事件，直接在html元素上绑定on-event，比如onclick，取消的话，dom.onclick = null, 同一个事件只能有一个处理程序，后面的会覆盖前面的
- DOM2级事件，通过addEventListener进行事件监听，通弄过removeEventListener来删除事件，一个事件可以有多个事件处理程序，按顺序执行，捕获事件和冒泡事件
- DOM3级事件，增加了事件类型，比如UI事件，焦点事件，鼠标事件
事件委托
事件委托可以减少事件的监听，优化操作性能，其原理是利用事件冒泡，给父级一个事件监听，点击级子元素冒泡到父元素的事件，然后判断当前点击的event元素类型，获取想要的值
