zoukankan      html  css  js  c++  java
  • js onclick与addEventListener 区别及用法

    addEventListener(建议使用)好比一个监听容器,这个容器里面可以装很多个监听事件,而且每一个事件都会执行。

    onclick 在今天之前我使用这个(onclick)比较多(单纯的是因为看到的基本都是用这个,有个缺点就是同一个元素绑定两个不同的事件前一个事件会被后一个事件覆盖。

    今天在公司问了一下这两个的区别,印象很深刻,自己也验证了一下,我这里上一段我的验证代码(代码里面的‘222’会被覆盖不弹出),大家也可以试一下:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>onclick and addEventListener</title>
            <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
        </head>
        <body>
            <div id="btnOk1">111</div>
            <script>
                document.getElementById('btnOk1').addEventListener('click',function(){
                    alert('111');
                });
                document.getElementById('btnOk1').addEventListener('click',function(){
                    alert('333');
                });
                document.getElementById('btnOk1').onclick = function(){
                    alert('222');
                }
                document.getElementById('btnOk1').onclick = function(){
                    alert('444');
                }
            </script>
        </body>
    </html>

  • 相关阅读:
    20201130-栈与链表
    K-means算法
    支持向量机-SVC
    贝叶斯-实现新闻数据分类
    贝叶斯-使用贝叶斯实现拼写检查器
    泰坦尼克求胜率预测-基于随机森林实现
    决策树算法-Python实现
    SQL_牛客网60题
    信用卡欺诈模型-逻辑回归
    用python实习逻辑回归
  • 原文地址:https://www.cnblogs.com/l-520/p/8882399.html
Copyright © 2011-2022 走看看