JS基础--addEventListener 事件绑定

本文介绍了JavaScript中事件绑定函数addEventListener的用法,包括事件处理函数的注册、事件的捕获与冒泡阶段,以及通过addEventListener实现的事件监听流程。
摘要由CSDN通过智能技术生成

在 JS 中 可以通过 事件绑定函数 addEventListener( ) 为指定元素对象绑定事件处理函数,且使用此函数可以为同一事件目标注册多个不同函数作为事件处理器。  语法格式如下

objectTarget.addEventListener(" eventType ", handler , captureFlag );

上面方法为  objectTarget 绑定事件处理器 handler ,其中的参数意义为:

参数一 : 事件类型字符串(事件类型的属性不带 on ,如 click 事件,mousedown 、keypass 等);

参数二 : 事件处理函数。(自己编写的函数 )

参数三 : 指定 监听事件传播的那个阶段(为 true 和 false 两个值,为 true 时表示 捕获阶段 ,false 表示 冒泡阶段)。

 

事件传递有两种方式:冒泡与捕获

捕获方式 : 就是在执行时 从外到内的执行函数,即从父集  向 子集层 执行;

冒泡方式 : 就是在执行时 从外到内的执行函数,即从父集  向 子集层 执行;

例如:

如果你将 <p> 元素插入到 <div> 元素中,用户点击 <p> 元素, 哪个元素的 "click" 事件先被触发呢?

在 冒泡 中,内部元素的事件会先被触发,然后再触发外

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值