zoukankan      html  css  js  c++  java
  • 关于事件的简单优化

    主要采用冒泡及委托的方式 进行优化


    关于事件绑定

    以如下的DOM举例

    <ul>
            <li> </li>
            <li> </li>
            <li> </li>
            ...
            <li> </li>
    </ul>

    如果想要对所有的li标签进行绑定Click事件,传统写法是对每个li进行onClick。都知道在Js中每个函数都是会占用内存的,内存中的函数越多,整体性能就越差。

    解决方案就是使用事件委托,将事件绑定在li标签的上层,例如ul。当然也可以在往上。

    在Jquery中提供了bind、live、delegete以及on方法来实现对事件的委托

    • bind 只存在的对象,当新增元素时不能委托
    • live 默认绑定到document ,如果DOM嵌套结构很深,事件冒泡会导致性能损失; 
    • delegete 自选绑定到某个对象
    • on 建议

    事件委托的原理在于利用事件冒泡

    关于事件冒泡

    对于事件冒泡,这就涉及到DOM0、DOM2
    大体DOM0、DOM2区别在于:
    1.Dom0 只支持冒泡,Dom2 均支持可指定事件触发的阶段
    2.Dom0同个对象添加多个事件会覆盖,Dom2不覆盖
    另外得注意的是,对于不同的浏览器,事件冒泡的节点还不一样。
     
    建议:
    当DOM嵌套结构不是很深时,可将事件委托给在body内最外层的div,例如<div class='container'></div>
     
  • 相关阅读:
    添加日志文件
    C库函数对文件的操作
    getpass的使用
    C语言实现 冒泡排序 选择排序 希尔排序
    批量Ping执行Bash脚本
    Script
    echo
    Centos7 pxe
    Rsync 参数
    Ip HostName查询
  • 原文地址:https://www.cnblogs.com/zhaoww/p/5887022.html
Copyright © 2011-2022 走看看