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>

  • 相关阅读:
    android 自定义动画4 RotateAnimation源码分析
    Android 绘图 阴影制作(Shadow)
    view, surfaceView, invalidate, postInvalidate, 刷新屏幕
    android database 常用字段描述
    Android标题栏进度指示器使用
    ThumbnailUtils Android2.2新增类
    Android 重力感应 测试代码
    Android中内嵌字体实现个性化
    Android中悬浮窗口
    Android布局Java代码构造法
  • 原文地址:https://www.cnblogs.com/l-520/p/8882399.html
Copyright © 2011-2022 走看看