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>

  • 相关阅读:
    下载地址jquery upload file demo (C#)
    特征卷积基于3D卷积神经网络的人体行为理解(论文笔记)
    应用目录S5PV210的BL1应用
    手机音效手机测试游戏类
    metadata查询Querying Metadata
    arraynodeSorting
    functionclass[LeetCode]Path Sum II
    functionclass[LeetCode]Permutation Sequence
    exceptionfunction[LeetCode]Permutations
    exceptionfunction[LeetCode]Permutations II
  • 原文地址:https://www.cnblogs.com/l-520/p/8882399.html
Copyright © 2011-2022 走看看