资讯专栏INFORMATION COLUMN

【js】what is 事件委托

caspar / 443人阅读

摘要:事件捕获目标事件阶段事件冒泡什么是事件委托解释了事件冒泡和事件捕获,来说说事件委托吧。事件委托利用了事件冒泡机制,只指定一个事件处理程序,就可以管理某一类型的所有事件。

什么是事件捕获
事件从一个不太具体的节点捕获到最具体的节点。例如,有一个DIV注册了一个绑定事件,那么事件捕获的过程是document》html》body》div

什么是事件冒泡
事件从一个具体的节点到不太具体的节点。例如,有一个DIV注册了一个绑定事件,那么事件冒泡的过程是div》body》html》document

DOM事件流
事件流一共三个阶段。事件捕获》目标事件阶段》事件冒泡

什么是事件委托
解释了事件冒泡和事件捕获,来说说事件委托吧。事件委托利用了事件冒泡机制,只指定一个事件处理程序,就可以管理某一类型的所有事件。是不是听起来有点拗口?举个例子。一个ul列表里有很多个li元素,li需要绑定点击事件,通过事件委托给ul绑定点击事件就可以管理ul下所有的li的点击事件。

为什么要使用事件委托
当页面有很多复杂的事件程序,就会有很多代码用来添加事件处理程序,内存消耗也会更大,代码也不优雅。使用了事件委托,可以只取得一个DOM元素,添加一个事件处理程序,就可以管理它的子节点所有同类事件。处理时间和性能消耗都会大大的减少

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/105397.html

相关文章

  • 切图崽的自我修养-梳理Jquery API

    摘要:前言梳理一下中还不太熟悉的事件绑定统一用摒弃掉之前的解绑事件统一用语法糖,支持多个事件绑定同一个函数语法糖,支持多个事件绑定不同的函数语法糖,支持多个事件绑定不同的函数可以往里传参可以给未创建的上绑定事件只能采取事件委托的形式所以写成这样是 前言 梳理一下Jquery中还不太熟悉的API Jquery事件绑定统一用on(摒弃掉之前的click,bind),解绑事件统一用off 语法...

    warnerwu 评论0 收藏0
  • 切图崽的自我修养-梳理Jquery API

    摘要:前言梳理一下中还不太熟悉的事件绑定统一用摒弃掉之前的解绑事件统一用语法糖,支持多个事件绑定同一个函数语法糖,支持多个事件绑定不同的函数语法糖,支持多个事件绑定不同的函数可以往里传参可以给未创建的上绑定事件只能采取事件委托的形式所以写成这样是 前言 梳理一下Jquery中还不太熟悉的API Jquery事件绑定统一用on(摒弃掉之前的click,bind),解绑事件统一用off 语法...

    JerryZou 评论0 收藏0
  • 切图崽的自我修养-梳理Jquery API

    摘要:前言梳理一下中还不太熟悉的事件绑定统一用摒弃掉之前的解绑事件统一用语法糖,支持多个事件绑定同一个函数语法糖,支持多个事件绑定不同的函数语法糖,支持多个事件绑定不同的函数可以往里传参可以给未创建的上绑定事件只能采取事件委托的形式所以写成这样是 前言 梳理一下Jquery中还不太熟悉的API Jquery事件绑定统一用on(摒弃掉之前的click,bind),解绑事件统一用off 语法...

    loonggg 评论0 收藏0
  • clipboard.js代码分析(3)- good-listener

    摘要:上一篇文章介绍了这个工具库中的第二个依赖,这个工具库主要完成了一个简易的事件订阅发布器。节点事件绑定判断一个元素是否是节点,是通过构造函数和属性来判断的。 上一篇文章介绍了clipboard.js这个工具库中的第二个依赖tiny-emitter,这个工具库主要完成了一个简易的事件订阅发布器。这次介绍一下clipboard.js源码中的最后一个依赖的轻型工具库good-listener,...

    objc94 评论0 收藏0
  • JavaScript 事件代理和委托

    摘要:原文地址事件代理和委托在中这个词经常出现,看字面的意思,代理委托。模型将事件处理流程分为三个阶段一事件捕获阶段,二事件目标阶段,三事件起泡阶段。事件目标当到达目标元素之后,执行目标元素该事件相应的处理函数。 原文地址:JavaScript 事件代理和委托 在javasript中delegate这个词经常出现,看字面的意思,代理、委托。那么它究竟在什么样的情况下使用?它的原理又是什么?在...

    littlelightss 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<