js-点击事件注意点

div.onclick=function(){}和div.addEventListener('click', function(){})两者之间的区别

区别1：同时绑定多个事件

div.onclick=function(){}第二次绑定事件会将第一次覆盖

<button id="btn">点击</button>        
<script>
    btn.onclick = function(){
        console.log('第一次点击');
    }
    btn.onclick = function(){
        console.log('第二次点击');
    }//输出：第二次点击
</script>

div.addEventListener('click', function(){})两次都会打印出结果

            <button id="btn">点击</button>
<script>
    btn.addEventListener('click',()=>{console.log('第一次点击');},false);
    btn.addEventListener('click',()=>{console.log('第二次点击'),false});
    //输出：第一次点击 第二次点击
</script>

用于处理指定和删除事件处理程序的操作： addEventListener()和removeEventListener(). 它们都接受三个参数：要处理的事件名，作为事件处理的一个函数，一个布尔值。 最后的布尔值如果为false，表示在冒泡阶段调用事件处理函数，如果是true，表示在捕获阶段调用事件处理程序。

2.决定事件触发顺序

div.onclick=function(){}由内到外 是以事件冒泡的方式来执行的
div.addEventListener('click', function(){})第三个参数设置为true（事件捕获）。由外到里