美文网首页
JS案例24-两种事件的书写规范

JS案例24-两种事件的书写规范

作者: hi__world | 来源:发表于2018-10-26 22:04 被阅读0次
  • ele.onclick=function(){ }
  • addEventListener()

第一种方法,如果一个元素同时存在两个方法,后面的会把前面的方法给覆盖掉。

第二种方法,不存在覆盖问题

具体看源码:

<!DOCTYPE html>
<html>
<head>
    <title>demo</title>
</head>
<body>
    <button>简书</button>
    <script>
        var btn=document.getElementsByTagName("button")[0];

        // 第一种事件方法,后者会覆盖前者
        btn.onclick=function(){
            alert(1)
        }
        btn.onclick=function(){
            alert(2)
        }

        // 第二种方法,不存在覆盖问题
        btn.addEventListener("click",function(){
            alert(3)
        })

        btn.addEventListener("click",fn1);


        function fn1(){
            alert(4)
        }
    </script>
</body>
</html>

相关文章

  • JS案例24-两种事件的书写规范

    ele.onclick=function(){ }addEventListener() 第一种方法,如果一个元素同...

  • 前端基本开发规范

    一般规范 HTML书写规范 CSS书写规范 JavaScript书写规范 一般规范 文件资源命名 资源(图片、js...

  • JS 书写规范

    1.不要用var,能使用const不用let let与const都是只在声明所在的块级作用域内有效。 let声明的...

  • JS书写规范

    JS 变量命名 命名方法 小驼峰式命名 命名规范 前缀应当是名词。(函数的名字前缀为动词,以此区分变量和函数) 命...

  • JS书写规范

    JS 变量命名 命名方法 小驼峰式命名 命名规范 前缀应当是名词。(函数的名字前缀为动词,以此区分变量和函数) 命...

  • eslint — js书写规范

    转载自:https://www.cnblogs.com/my93/p/5681879.html 一、安装npm i...

  • require.js和sea.js的区别

    require.js和sea.js的区别 首先原理上的区别 sea.js遵循CMD规范.书写方式类似node.js...

  • JS高级学习:贪吃蛇案例

    键盘按下事件 案例:贪吃蛇 Food.js Snake.js Game.js

  • js模块引入和导出常用规范

    js模块常用有两种,common.js规范和ES6规范,今天来记录一下,不要再export,exports,req...

  • 22.Vue 监听input事件,并获取值

    在Vue中通过监听js的oninput事件,并获取输入的值,参考案例: 案例:

网友评论

      本文标题:JS案例24-两种事件的书写规范

      本文链接:https://www.haomeiwen.com/subject/dtvhtqtx.html