JavaScript事件处理程序和事件流

blankです

已于 2022-07-08 11:23:50 修改

阅读量1.2k

点赞数

文章标签：前端

于 2022-04-26 14:58:50 首次发布

本文链接：https://blog.csdn.net/weixin_47782618/article/details/124427157

版权

本文详细介绍了JavaScript中的事件处理程序，包括HTML事件处理、DOM0级、DOM2级和IE事件处理，并探讨了事件流的概念，如事件冒泡流和事件捕获流，深入理解JavaScript事件机制。

摘要由CSDN通过智能技术生成

1. 事件处理程序的分类

事件处理程序分为HTML事件处理、DOM0级事件处理、DOM2级事件处理和IE事件处理。

1.1 HTML事件处理

<body>
    <div id="div">
        <button onclick="demo()">HTML事件处理</button>
    </div>
    <script>
        function demo(){
            console.log("HTML事件处理");
        }
    </script>
</body>

HTML事件处理的优点：代码量小，容易编写。

HTML事件处理的缺点：HTML和JavaScript的代码耦合度高，且HTML事件无法取消。

1.2 DOM0级事件处理

<body>
   <div>
        <button id="btn1">DOM0级事件处理</button>
   </div>
   <script>
        var btn1=document.getElementById("btn1");
        btn1.onclick=function(){
            console.log("DOM0级事件处理1");
        }        //被覆盖掉
        btn1.onclick=function(){
            console.log("DOM0级事件处理2");
        }
        // D

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

blankです

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript事件处理程序和事件流

1. 事件处理程序的分类事件处理程序分为HTML事件处理、DOM0级事件处理、DOM2级事件处理和IE事件处理。2. HTML事件处理<body> <div id="div"> <button onclick="demo()">HTML事件处理</button> </div> <script> function demo(){ console.
复制链接

扫一扫