这里涉及到addEventListener的三个参数：
第一个参数：事件类型
第二个参数：事件的处理函数
第三个参数：指定事件处理函数的时期或阶段(boolean)，默认值为
DOM事件流
第三个参数设计到事件的捕获与冒泡，为true时捕获，false时冒泡。默认为false，即冒泡
<div class="div1" id="div1">
<div class="div2">
<div class="div3">
</div>
</div>
<script>
let div1 = document.querySelector(".div1")
let div2 = document.querySelector(".div2")
let div3 = document.querySelector(".div3")
div1.addEventListener('click', function() {
alert(1)
}, true)
div2.addEventListener('click', function() {
alert(2)
}, true)
div3.addEventListener('click', function() {
alert(3)
}, true)
</script>
布局图
当我们点击div3的时候的执行顺序
如果是捕获：div1,di2,di3
如果是冒泡：div3,di2,di1
