关于事件捕获和冒泡

DOM事件流分为三个阶段：捕获阶段、目标阶段、冒泡阶段

点击目标元素后，不会马上触发目标元素，而是先执行事件捕获，从顶部逐步到目标元素；处于目标阶段的时候触发目标元素；最后冒泡阶段，从目标元素逐步回到顶部。

<div class="container" id="container"><div class="item" id="item"><div class="btn" id="btn">Click me</div></div>
</div><script>document.addEventListener('click', (e) => {console.log('Document click');console.log(e);},{capture: true})container.addEventListener('click', (e) => {console.log('Container click')console.log(e.currentTarget, e.targeet)},{capture: true})item.addEventListener('click', () => {console.log('Item click')})btn.addEventListener('click', () => {console.log('Btn click')})
</script>