事件冒泡和捕获

  • 捕获的过程是从最外层的div到最里面的一层
  • 接着就是向外冒泡执行，如果想阻止冒泡可以使用e.stopPropagation()（要考虑兼容性）
<body>
    <div onclick="console.log(4)">
        <div onclick="console.log(3)">
            <div onclick="console.log(2)">
                <div  class="two">
                    点击
                </div>
            </div>
        </div>
    </div>
</body>
<script>
    let two = document.querySelector('.two')
    two.onclick = (e)=>{
        console.log(1)
        e.stopPropagation()
    }
</script>

执行结果只打印了1，如果不阻止冒泡会打印1,2,3,4

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容