zoukankan      html  css  js  c++  java
  • 事件委托

     

    概括

      事件委托,又叫事件代理。在js高级中,事件委托就是利用冒泡事件,指定一个事件处理程序,可以管理某一类的所有事件。

      各路大牛在讲事件委托时,都使用了取快递来解释:

        有三个同事预计会在周一收到快递。为签收快递,有两种办法:一是三个人在公司门口等快递;二是委托给前台小姐姐代为签收。现实当中,我们大都采用委托的方案(公司也不会容忍那么多员工站在门口就为了等快递)。前台小姐姐收到快递后,她会判断收件人是谁,然后按照收件人的要求签收,甚至代为付款。这种方案还有一个优势,那就是即使公司里来了新员工,前台小姐姐也会在收到寄给新员工的快递后核实并代为签收。

      其中还包含两种意思

        ---委托前台的同事可以是可以代为签收的,即程序中的dom节点有事件

        ----新来的员工可以委托前台代签,即程序中新添加的dom节点也会有事件

     

     

    为什么使用事件委托

      通常情况下,dom节点需要事件处理程序,都会给dom节点添加事件处理程序就好了,但是当需要很多dom添加事件处理程序,比如有100个li,并且这些li都有相同的click点击事件,这时候我们会使用for循环来遍历所有的li,然后给他们添加事件,但这样做给执行带来很大的影响

      每个函数都是一个对象,是对象就会占用内存,对象越多,内存占用率就越大,事件的处理程序数量影响着整个页面的运行性能,这就是为什么性能优化的主要思想之一就是减少DOM操作的原因

     

    事件委托的原理

      利用冒泡原理来实现,就是在最底层的节点开始,逐步向上传递事件,比如给最里面的a加一个click点击事件,那么这个事件就会一层一层的往外执行,执行顺序a>li>ul>div,有这样一个机制,那么我们给最外面的div加点击事件,那么里面的ul,li,a做点击事件的时候,都会冒泡到最外层的div上,所以都会触发,这就是事件委托,委托它们父级代为执行事件

  • 相关阅读:
    006-Spring Boot自动配置-Condition、Conditional、Spring提供的Conditional自动配置
    005-Spring Boot配置分析-配置文件application、Environment、PropertySource、@Value、EnvironmentPostProcessor、Profiles
    新浪云php与java连接MySQL数据库
    基于网页内容数据采集 PHP开发学习笔记
    淘宝理财 中证500 中证300 基金收益计算
    响应式Web设计(Responsive Web design)
    FOJ 1075
    锐捷上网认证常见问题及解决办法
    session与cookie的区别
    php email邮箱正则验证
  • 原文地址:https://www.cnblogs.com/haloqq/p/10541523.html
Copyright © 2011-2022 走看看