事件委托,会把一个或者一组元素的事件委托到它的父层或者更外层元素上,真正绑定事件的是外层元素,而不是目标元素当事件响应到目标元素上时,会通过事件冒泡机制从而触发它的外层元素的绑定事件上,然后在外层元素上去执行函数```

下面举个例子:比如一个宿舍的同学同时快递到了,一种笨方法就是他们一个个去领取,较优方法就是把这件事情委托给宿舍长,让一个人出去拿好所有快递,然后再根据收件人一一分发给每个同学,在这里,取快递就是一个事件,每个同学指的是需要响应事件的 DOM元素,而出去统一领取快递的宿舍长就是代理的元素,所以真正绑定事件的是这个元素,按照收件人分发快递的过程就是在事件执行中,需要判断当前响应的事件应该匹配到被代理元素中的哪一个或者哪几个!

事件代理(冒泡机制)相关推荐

  1. JS事件冒泡机制和兼容性添加事件

    本篇文章主要来讲讲 事件的冒泡机制 和 添加事件的几种方法. 一. JS的时间传递顺序: 捕获阶段 -> 目标阶段 -> 冒泡阶段 捕获阶段是指从父层往子层找.比如 <body> ...

  2. 事件模型、事件流(冒泡与捕获)、事件代理

    本文原链接:https://www.cnblogs.com/hngdlxy143/p/9068282.html https://www.jb51.net/article/139997.htm 事件模型 ...

  3. “约见”面试官系列之常见面试题第三十四篇之事件冒泡、事件捕获、事件代理(建议收藏)

    对于事件的传播机制,Netscape Communicator采用的是事件捕获(event capture),IE9.Safari.Chrome.Opera和Firefox采用的是事件冒泡(event ...

  4. javascript 事件冒泡和事件代理

    事件冒泡 简单的讲,当子元素的事件处理函数被触发(如onclick),该事件会从事件源(当前子元素)逐级向上层元素传递,触发祖先元素的 onclik 事件,一直到最外层 html 根元素. 这可能会带 ...

  5. 事件传播机制/事件委托/事件代理

    事件传播机制分为三个阶段: 第一阶段:从window对象传导到目标节点,称为"捕获阶段" 第二阶段:在目标节点上触发,称为"目标阶段" 第三阶段:从目标节点传导 ...

  6. JS 事件高级(包括DOM事件流,阻止事件冒泡,阻止事件默认行为,,,以及对我来说,很好用的 事件代理)

    事件对象概念 事件处理函数:事件发生时调用的函数 事件对象:window.event,内置的对象,事件发生的时候会将所有和事件相关的信息都存储在事件对象中,鼠标位置,事件类型,事件目标... //事件 ...

  7. 事件代理(事件委托)、事件冒泡

    事件代理(事件委托) 事件代理又称为事件委托,一般作用于当多个相同元素需要使用同一个事件时,可以委托给他们的同一父元素上进行处理,这样会优化性能,不用给每个子元素都注册一遍事件,节省代码空间,减少代码 ...

  8. JS的事件处理机制以及事件代理(事件委托)

    一.先记个小知识点.cssText cssText 本质:设置 HTML 元素的 style 属性值. 用法:document.getElementById("d1").style ...

  9. 浏览器事件代理机制原理?

    关于浏览器事件代理 弄明白浏览器事件代理事前,先了解下事件.事件流. 一,事件 HTML DOM 允许 JavaScript 对 HTML 事件作出反应.即操作对应HTML元素时,会触发相应事件(包含 ...

最新文章

  1. 关于JSON的简介及取值以及常见面试题
  2. c语言 开辟复数指针数组,指针和数组 - llwwzz的个人空间 - OSCHINA - 中文开源技术交流社区...
  3. 给其他账户访问mysql的权限,将postgresql数据库的权限授予其他用户
  4. 关于Java Collections Framework的一些总结(2)
  5. 暴露的全局方法_Dubbo源码解析实战 - 服务暴露原理
  6. linux里shell中的test代表的意义
  7. HTML5 动态统计表
  8. 2.3.3 Zero Sum 和为零(DFS)
  9. ws2812b灯带容易坏_WS2812B灯带STC驱动
  10. Google Dinosour 小恐龙
  11. pytorch学习笔记7--循环神经网络、GAN
  12. [BZOJ3717] [PA2014] Pakowanie [状态压缩][dp]
  13. 您有新的订单提示音在线试听_告别千篇一律的微信提示音
  14. word2vec源码详解
  15. [RK3399][Android7.1] Audio中的Ducking模式
  16. 图片的合成(个人练习,不喜勿喷!)
  17. JAVA毕设项目书香校园阅读平台(java+VUE+Mybatis+Maven+Mysql)
  18. 洛谷:P2172 [国家集训队]部落战争
  19. 基于 FFMPEG 的像素格式变换(swscale,致敬雷霄骅)
  20. C语言:编写程序把你的年龄转换成天数,不考虑闰年。

热门文章

  1. 【博主推荐】星空版的九宫格酷炫抽奖HTML源码
  2. python(pycharm)环境加速安装第三方库
  3. 再谈编程-----终结QQ空间写技术文章
  4. 前景与挑战并存 餐饮信息化当突围
  5. 驱动级键盘模拟(C#)修复源码下载(转)
  6. No.067<软考>《(高项)备考大全》【冲刺14】《软考高项极简知识点(3)》
  7. 发现公布错误是新闻价值所在
  8. 在CentOS7中安装思维脑图软件XMind
  9. 航天信息管理软件无法连接服务器,航天信息客户端怎样连接服务器
  10. 可视化神器Plotly绘制3D图