请解释什么是事件代理

简介: 请解释什么是事件代理

事件代理

事件代理:就是把一个元素的响应事件的函数委托给另一个元素

js的事件流会经过三个阶段:捕获阶段->目标阶段->冒泡阶段,而事件委托就是在冒泡阶段完成。

事件委托

会把一个或一组元素的事件委托到它的父级或者更外层元素上,真正绑定事件的是外层元素,而不是目标元素

当事件响应到目标元素上时,会通过事件冒泡机制从而触发它的外层元素的绑定事件上,然后在外层元素上执行函数

适合事件委托的事件有: click , mousedown , mouseup , keydown , keyup , keypress 从上⾯应⽤场景中。

事件委托存在两⼤优点:

减少整个⻚⾯所需的内存,提升整体性能

动态绑定,减少重复⼯作

但是使⽤事件委托也是存在局限性:

focus 、 blur 这些事件没有事件冒泡机制,所以⽆法进⾏委托绑定事件

mousemove 、 mouseout 这样的事件,虽然有事件冒泡,但是只能不断通过位置去计算定位, 对性能消耗⾼,因此也是不适合于事件委托的

如果把所有事件都⽤事件代理,可能会出现事件误判,即本不该被触发的事件被绑定上了事件。


相关文章
|
存储 设计模式 分布式计算
全量、增量、流水、拉链、快照、代理键、缓慢变化维...
全量、增量、流水、拉链、快照、代理键、缓慢变化维...
|
11月前
|
算法 测试技术
模块化设计具体应该怎么做呢
【10月更文挑战第22天】模块化设计具体应该怎么做呢
|
8月前
|
弹性计算 负载均衡 安全
【上云基础系列03】基于标准架构的安全升级
本文回顾了业务上云从基础到进阶的理念,介绍了企业在不同发展阶段所需的架构选择。在“入门级:上云标准弹性架构基础版”的基础上,本文针对安全升级,重点介绍了:(1)公网入口基于应用型负载均衡ALB集成WAF防护,提升Web应用的安全性;(2)公网出口则通过NAT网关升级为CFW防火墙,保障出站流量的安全。 此外,还提供了详细的架构演进说明,涵盖从入门级标准弹性架构到高级安全能力和数据库升级的全过程。
|
存储 负载均衡 NoSQL
一文让你搞懂 zookeeper
一文让你搞懂 zookeeper
15631 15
|
存储 SQL 监控
一文解读如何落地企业级云上日志审计方案
近年来,随着云计算的广泛应用和企业上云的深度普及,许多企业或个人用户将各种日志托管在云上进行留存,从而进行查询、审计等操作。什么是日志审计?为什么要做日志审计?企业如何落地云上日志审计方案?带着这些问题出发,本文将以阿里云日志服务(SLS)旗下的日志审计服务为视角切入,带领读者从当今网络安全形势和法律法规要求出发,解读云计算背景下,如何构建、运行、实践一个标准的企业级云上审计方案,从而更好地保障企业或组织的云上资产、云上数据的安全,确保企业业务持续安全稳定地运行。
|
SQL 安全 中间件
AppScan安全扫描工具之安装及配置GlassBox
IBM AppScan是一个自动化Web应用安全漏洞评估工具,通过安装和配置GlassBox可以检测更多Web程序的安全漏洞。
166 0
AppScan安全扫描工具之安装及配置GlassBox
|
运维 Devops 应用服务中间件
阿里云云效操作报错合集之从企业仓库里拉取依赖报错403,该如何解决
本合集将整理呈现用户在使用过程中遇到的报错及其对应的解决办法,包括但不限于账户权限设置错误、项目配置不正确、代码提交冲突、构建任务执行失败、测试环境异常、需求流转阻塞等问题。阿里云云效是一站式企业级研发协同和DevOps平台,为企业提供从需求规划、开发、测试、发布到运维、运营的全流程端到端服务和工具支撑,致力于提升企业的研发效能和创新能力。
阿里云云效操作报错合集之从企业仓库里拉取依赖报错403,该如何解决
|
JavaScript 小程序 Java
大学生租房系统|基于SpringBoot的大学生租房系统设计与实现(源码+数据库+文档)
大学生租房系统|基于SpringBoot的大学生租房系统设计与实现(源码+数据库+文档)
242 0
|
算法 C语言 C++
万字详解:C语言三子棋进阶 + N子棋递归动态判断输赢(一)
三子棋游戏设计的核心是对二维数组的把握和运用。
236 1
|
XML Java Android开发
Myeclipse 为项目设置UTF-8格式:
在Eclipse中设置UTF-8编码:1) Window -> Preferences,选择General -> Workspace,设置Text file encoding为UTF-8。2) 同样路径,进入Content Types,选中Text,设Java Source File默认编码为UTF-8。其他文件类型如properties和XML默认已设定。
294 2