js addEventListener和attachEvent

最新推荐文章于 2019-10-25 18:55:58 发布

若寒hqq

最新推荐文章于 2019-10-25 18:55:58 发布

阅读量413

点赞数

分类专栏： javascript高级程序设计文章标签： javascript

本文链接：https://blog.csdn.net/u014682977/article/details/45315583

版权

javascript高级程序设计专栏收录该内容

12 篇文章 0 订阅

订阅专栏

attachEvent有两个属性，给IE用

addEventListener有三个属性，addEventListener(event,function,useCapture);

《javascript高级程序设计》346页

第三个为false是冒泡（从里层的节点到根节点），为true是捕获（从根节点到点击的里层节点）。

可以看看如下这个例子，当两个都为true，即都为捕获，则先执行div再p；

若都为false，则先执行p再div；若一个为true,一个为false，则先执行true的事件，因为捕获总是先于冒泡（先下后上）。

最好自己练练哦*—*

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script>
        window.onload = function(){
            var aP = document.getElementsByTagName('p');
            var aDiv = document.getElementsByTagName('div');
            aDiv[0].addEventListener('click',function(){
                console.log('div被点击');
            }, true);
            aP[0].addEventListener('click',function(){
                console.log('p被点击');
            }, true);
        }

    </script>
    <style type="text/css">
        p{
            background: red;
        }
        div{
            border : 1px solid grey;
            height : 200px;
        }
    </style>
</head>
<body>
<div>
    <p>click me</p>
</div>
</body>
</html>

若寒hqq

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js addEventListener和attachEvent

addEventListener有三个属性，addEventListener(event,function,useCapture);《javascript高级程序设计》346页第三个为false是冒泡（从里层的节点到根节点），为true是捕获（从根节点到点击的里层节点）。可以看看如下这个例子，当红色标记的那两个都为true，即都为捕获，则先执行div再p；若都为false，则先
复制链接

扫一扫

专栏目录