首页 > 编程语言 >Javascript中addEventListener的3个参数

Javascript中addEventListener的3个参数

时间:2024-01-18 11:45:23浏览次数:27  
标签:useCapture 捕获 Javascript 参数 冒泡 addEventListener 事件

// 例
document.addEventListener('click', () => {
    // do something
    ...
}, false)

 

1. addEventListener,接收3个参数

第一个参数event:监听的事件名称

第二个参数是函数:需要执行的事件

第三个参数是useCapture(变量):用来判断是捕获还是冒泡

 

2.第三个参数为userCapyure时

1)当useCapture为true的时候是在捕获阶段触发事件 (捕获事件触发顺序是由父到子)

2)当useCapture为false的时候是在冒泡阶段触发事件(默认为false)(冒泡事件触发顺序是由子到父)

3.第三个参数不一定是 bool 值,也可以是个对象,它提供了更多选项。

once:只执行一次。
passive:承诺此事件监听不会调用 preventDefault,这有助于性能。
useCapture:是否捕获(否则冒泡)。

实际使用,在现代浏览器中,还可以不传第三个参数,建议默认不传第三个参数,因为冒泡是符合正常的人类心智模型的,大部分业务开发者不需要关心捕获过程。除非你是组件或者库的使用者,那就总是需要关心冒泡和捕获了。

标签:useCapture,捕获,Javascript,参数,冒泡,addEventListener,事件
From: https://www.cnblogs.com/paris-dream/p/17928759.html

相关文章

  • 记一个vue2中使用路由时,在同一个页面跳转,但是url参数不同,不会重新渲染页面的问题
    vue2中使用路由时,页面自己跳转自己,但是携带的参数不一样预期想要的结果是:感冒2会跟随着url的参数进行变化,但是并没用 解决方法: 在App.vue这个页面中的router-view添加  :key="$route.fullPath"结果在自己跳转自己之后会刷新页面 达成:参考:https://blog.csdn.ne......
  • JavaScript自建文档
    JavaScript温习文档JavaScript的使用场景网页特效发(node.js)桌面程序(electron)app(cordova)硬件控制(物联网)游戏开发(cocos2d-js)浏览器执行js过程渲染引擎:解析html和css,chrome用的blink,老版本用的webkitjs引擎:也叫js解析器,用来读取网页中的JavaScript......
  • JavaScript(JS) 判断没有属性的空对象{}的四种方法
    ​ JavaScript(JS)中对象没有属性初始化时,可能使用{}进行初始化,如此我们判断这样的没有属性的空对象就不是很方便,本文主要介绍JavaScript(JS)中判断没有属性的空对象{}的五种方法,以及相关的示例代码。1、通过JSON.stringify()判断可以使用JSON.stringify()将Javascript对象......
  • 正则表达式复习七——JavaScript 中使用
    JavaScript使用JavaScript的正则表达式是由RegExp对象表示的,同时也可以使用正则表达式字面量。1.使用RegExp对象letpattern=newRegExp("pattern","flags");pattern是字符串形式的正则表达式模式。flags是字符串形式的修饰符,可以包含i,g,m等。letpattern......
  • Hive之set参数大全-8
    指定LLAP(LowLatencyAnalyticalProcessing)的执行模式hive.llap.execution.mode是ApacheHive中的一个配置属性,用于指定LLAP(LowLatencyAnalyticalProcessing)的执行模式。该属性用于决定Hive查询是否使用LLAP引擎执行。以下是使用SQL语言设置此属性的示例:--设置LLAP的执行......
  • Hive之set参数大全-9
    指定LLAP(LowLatencyAnalyticalProcessing)引擎中的IO(输入/输出)线程池的大小hive.llap.io.threadpool.size是ApacheHive中的一个配置属性,用于指定LLAP(LowLatencyAnalyticalProcessing)引擎中的IO(输入/输出)线程池的大小。以下是使用SQL语言设置此属性的示例:--设置LLAP引擎......
  • 利用javascript获取并修改伪元素的值
    HEAD中添加style标签强制覆盖初始属性这个方法是利用内部css样式的高优先级来覆盖外部css,好处是简单易理解,实现简单。坏处就是吃相太难看,过于粗暴。varstyle=document.createElement('style');style.innerHTML=".test::before{color:green}";//添加样式内容的话也可以用上面提......
  • DOTS Instancing合批:如何针对单个渲染实体修改材质参数
    DOTSInstancing合批:如何针对单个渲染实体修改材质参数   最近在做DOTS的教程,由于DOTS(版本1.0.16)目前不支持角色的骨骼动画,我们是将角色的所有动画数据Baker到一个纹理里面,通过修改材质中的参数AnimBegin,AnimEnd来决定动画播放的起点和终点,材质参数AnimTime记录当前过去......
  • 「云渲染科普」Vray渲染效果图材质参数设置
    ​渲染是创造出引人入胜视觉效果的关键步骤,在视觉艺术领域尤为重要。不过,渲染作为一个资源密集型的过程,每当面对它时,我们往往都会遭遇到时间消耗和资源利用的巨大挑战。幸运的是,有几种方法能够帮助我们优化渲染,使之既高效又经济。例如,通过掌握一些渲染设置技巧,利用云渲染等服务,或......
  • 最新Unity DOTS Instancing合批:如何针对单个渲染实体修改材质参数
    最近在做DOTS的教程,由于DOTS(版本1.0.16)目前不支持角色的骨骼动画,我们是将角色的所有动画数据Baker到一个纹理里面,通过修改材质中的参数AnimBegin,AnimEnd来决定动画播放的起点和终点,材质参数AnimTime记录当前过去的动画时间。但是在做大规模战斗控制的时候,有10000+的小兵在战斗......