IE冒泡机制

最新推荐文章于 2022-01-22 23:54:56 发布

github_turboemily

最新推荐文章于 2022-01-22 23:54:56 发布

阅读量413

点赞数

分类专栏：兼容文章标签： ie兼容

本文链接：https://blog.csdn.net/github_35549695/article/details/52594086

版权

兼容专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #div1{
            width:500px;
            height: 500px;
            background-color: aqua;
        }
        #div2{
            width:300px;
            height: 300px;
            background-color:darkcyan;
        }
        #div3{
            width:100px;
            height: 100px;
            background-color:darksalmon;
        }
    </style>
    <script>

        window.onload = function(){
            var div1 = document.getElementById('div1');
            var div2 = document.getElementById('div2');
            var div3 = document.getElementById('div3');

            div1.attachEvent('onclick',function(){
                alert('div1');
            });//捕获
            div3.attachEvent('onclick',function(){
                alert('div3');


            });//目标函数

            div1.attachEvent('onclick',function(){
                alert('div1');
            });//冒泡

        }

    </script>
</head>
<body>

<div id="div1">

    <div id="div2">

        <div id="div3">

        </div>
    </div>
</div>

</body>
</html>

这几天准备整理一些兼容性问题：

直接上代码，上面是IE浏览器上面的冒泡事件。

当我点击div3的时候，首先弹出alert（‘div3'）;后面接着弹出2个div1；

当我点击div1的时候，直接弹出2个div1；

虽然我没有给div2绑定事件，当我点击div2的时候，也弹出了2个div1;

以上事例表明：ie浏览器只有冒泡事件，没有捕获。

github_turboemily

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
IE冒泡机制

html lang="en">head> meta charset="UTF-8"> title>Titletitle> style> #div1{ width:500px; height: 500px; background-color: aqua; }
复制链接

扫一扫