javascript事件绑定与监听的区别 

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title>事件绑定与监听的区别</title>
    </head>

    <body>
        <button id="btnA">按钮A</button>
        <button id="btnB">按钮B</button>
        <script type="text/javascript">
            var btnA = document.getElementById("btnA");
            var btnB = document.getElementById("btnB");
            btnA.onclick = function() {
                alert("你点了一下");
            }
            btnA.onclick = function() {
                alert("你又点了一下");
            }

            btnB.addEventListener("click",function(event){
                alert("你点了一下");
            },false);

            btnB.addEventListener("click",function(event){
                alert("你又点了一下");
            },false);
        </script>
    </body>

</html>

使用on事件名的形式绑定事件后绑定会覆盖前面绑定的事件，也就是最后一个绑定的事件会生效；

使用addEventListener绑定事件则不会覆盖，可同时在一个元素上绑定多个相同的事件。

posted @ 2020-06-17 15:30  小猿笔记  阅读(639)  评论(0)  编辑  收藏  举报