JavaScript事件绑定和普通事件区别

最新推荐文章于 2023-03-01 09:27:53 发布

吃瓜群众欢乐多

最新推荐文章于 2023-03-01 09:27:53 发布

阅读量278

点赞数

文章标签： javascript

区别十分简单，直接看代码吧

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
</head>
<body>
    <button id="btn">button</button>
    <script type="text/javascript">
        var btn=document.getElementById("btn");

        btn.οnclick=function  () {
            alert('普通事件1');//不执行
        }
        btn.οnclick=function  () {
            alert('普通事件2');//弹出  <span style="color: rgb(70, 70, 70); font-family: 'Microsoft YaHei', 'Helvetica Neue', SimSun; font-size: 14px; line-height: 21px; background-color: rgb(188, 211, 229);">//执行完代码后，只执行alert(2),将</span><span style="word-wrap: normal; word-break: normal; line-height: 21px; color: rgb(70, 70, 70); font-family: 'Microsoft YaHei', 'Helvetica Neue', SimSun; font-size: 14px; background-color: rgb(188, 211, 229);">alert(1)覆盖。</span>
        }

//      上面用普通方法添加两个事件，下面用事件绑定添加两个事件。

        btn.addEventListener('click',function  () {
            alert('事件绑定1');//弹出
        },false)
        btn.addEventListener('click',function  () {
            alert('事件绑定2');//弹出
        },false)

        //注意我这里只使用W3C的标准写法添加事件，没有兼容低版本的IE。

    </script>
</body>
</html>

上面代码执行后依次会弹出：普通事件2、事件绑定1、事件绑定2。

区别就是普通事件只支持单个事件，而事件绑定可以添加多个事件，就这么简单。

吃瓜群众欢乐多

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript事件绑定和普通事件区别

区别十分简单，直接看代码吧 Document button var btn=document.getElementById("btn"); btn.onclick=function () { alert('普通事件1');//不执行 } btn.onclick
复制链接

扫一扫