JavaScript 事件的冒泡问题

本文详细解析了事件冒泡的概念,即多个嵌套元素触发相同事件时的传播过程,并介绍了如何使用e.stopPropagation()等方法有效阻止事件冒泡,适用于火狐、谷歌等浏览器。同时,文章还阐述了事件处理的三个阶段:捕获、目标和冒泡。

事件冒泡主要是指:

   多个元素嵌套,有层次关系,这些元素都注册了相同的事件,如果里面的元素的事件触发了则外面元素的事件也会依层触发

阻止事件冒泡 的主要方法

    window.event.cancelBubble() 火狐不支持,IE、谷歌支持

    

onclick=function (e) {
    console.log(this.id);
    //阻止事件冒泡
    e.stopPropagation(); // 火狐,谷歌支持,IE8不支持
  };

事件主要的三个阶段:

1.事件的捕获阶段 从外往内

2.事件的目标阶段 选择的那个

3.事件的冒泡阶段 从内往外

 

转载于:https://www.cnblogs.com/FlyBlueSky/p/9986377.html

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符  | 博主筛选后可见
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值