javascript事件冒泡与事件委派

15 篇文章 0 订阅

JavaScript事件冒泡

1.JavaScript事件冒泡(Bubble);所谓冒泡指的就是事件的向上传导,当后代元素上的事件被触发时,其祖先元素的相同事件也会被触发。

2.在开发中大部分情况冒泡都是有用的,如果不希望冒泡发生可以通过事件对象取消冒泡event.cancelBubble=true

3.案列如下:

id“box”和“innerBox”背景颜色可任意设置一个

(box背景颜色粉红色,innerBox背景颜色紫色)

Html源代码:

4.Css源代码:

没有使用link标签引入样式,在源代码编程的请注意要添加style标签

5.JavaScript代码:

全文章都没有使用引入的方式去编程,因为这种小案例,不用太多的麻烦去引入添加更多的文件,索性直接在源代码里编程,但也要注意先后顺序

JavaScript事件委派

6.事的委派:指将事件统一绑定给元素共同的祖先元素,这样当后代元素上的事件触发时,会一直冒泡 到祖先元素,从而通过祖先元素的响应函数来处理事件。

7.事件委派是利用冒泡,通过委派可以减少事件 绑定的次数,提高程序的性能。事件对象的属性target:返回触发此事件的元素(事件的目标节点)

案例:

8.html代码

9.JavaScript代码

10.JavaScript事件委派也是没有使用到引入,只是简单的写出的案例。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值