zoukankan      html  css  js  c++  java
  • 事件冒泡和事件捕获

    1.事件冒泡

    obj.addEventListener(event,fn,useCapture);

    useCapture:为false是事件冒泡;为true为事件捕获

    2.ie兼容问题

    给元素添加事件:attachEvent(“on”+type,fn)、addEventListener

    给元素删除事件:detachEvent(“on”+type,fn)、removeEventListener

    获取事件源对象:ev、window.event      (target和srcElement)

    阻止事件冒泡:stoppropagation 、cancelBublue

    阻止默认行为:preventDefault

    补充: stopPropagation()方法既可以阻止事件冒泡,也可以阻止事件捕获,也可以阻止处于目标阶段。

    用DOM3级新增事件stopImmediatePropagation()方法来阻止事件捕获,另外此方法还可以阻止事件冒泡。

    3、DOM事件流被分为事件捕获阶段 目标阶段 冒泡阶段

    案例:遮罩层点击的时候可能会触碰下层的事件

    mouseover和mouseout会涉及冒泡事件;mouseenter和mouseleave事件不冒泡。(dom3鼠标事件共9个)

    补充:事件代理即事件委托的知识,其实事件委托的原理就是事件冒泡,将子元素的事件绑定到父元素上监听,使用事件代理的好处是可以提高性能

    监听原理:

      document.getElementById("div").addEventListener("click",fuction(e){

       //e.target 被点击的元素

        //e.target.nodeName 可操作性判断条件,节点名称 ;className。。。

       })

  • 相关阅读:
    texarea动态改变监听
    输入配置
    linux 上安装redis 解压之后使用make命令报错
    sql语句能查询出 放在web程序查询不出
    Eclipse 使用git pull 代码时发生冲突的解决办法
    eclipse git 解决冲突
    微信小程序获取openid
    mybatis 一对多 一对一 xml配置
    Eclipse 中撤消git push提交
    idea 开发中遇到的问题
  • 原文地址:https://www.cnblogs.com/QIQIZAIXIAN/p/7204428.html
Copyright © 2011-2022 走看看