本文目录

JavaScript 冒泡和捕获

🌙
手机阅读
本文目录结构
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>点击哪个标签就把哪个标签名输出</title>
</head>
<body>
<div id="div1" style="background: red">
    <br/>
    <ul id="ul1" style="background: blue">
        <br/>
        <li id="li1" style="background: orange">
            <br/>
            <a href="1" style="background: olive;display: block;"><br/>1</a>
            <a href="2" style="background:blueviolet;display: block;"><br/>2</a>
            <a href="3" style="background: olive;display: block;"><br/>3</a>
            <a href="4" style="background: chocolate;display: block;"><br/>4</a>
        </li>
    </ul>
</div>
</body>
</html>
<script>
    function fn(e){
        e=e||event;
        if(e.stopPropagation){
            e.stopPropagation();
        }else{
            e.cancelable=true;
        }
        if(e.preventDefault){
            e.preventDefault();//标准浏览器阻止默认行为
        }else{
            e.returnValue=false;//IE阻止默认行为
        }
        console.log(this.nodeName);
    }
    eles=document.getElementsByTagName("*");
    for(var i=0;i<eles.length;i++){
        eles[i].addEventListener("click",fn,false);
    }

    //下面是动态创建的
    var p=document.createElement("p");
    document.body.appendChild(p);
    p.innerHTML="222312312312";
    /*动态创建的,不能有效果,可以用事件委托来实现*/
</script>

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了