zoukankan      html  css  js  c++  java
  • 简述事件捕获和事件冒泡的区别

    object基类:

      function array number Boolean string date math  regexp

    事件:

      浏览器客户端上客户触发的行为都称为事件

      所有的事件都是天生自带的,不需要我们去绑定,只需要我们去触发;

    通过obj.事件名=function(){}

      事件名:onmouseup;onmousedown;onclick。。。

      当用户触发一个事件时,浏览器所有的详细信息都存在一个叫event的对象上;我们把它叫事件对象。

      所有事件在绑定方法的时候,天生自带一个参数叫event

    鼠标的坐标:

      event.clientX  event.clientY

    event的兼容性:

      在谷歌(Chrome)下event是undefined

      在IE低版本(6-8)下event是null  

      在火狐下会报错

      document.onclick=function(ev){

        var ev=ev||window.event

      }

    事件冒泡:

      当给父子元素的同一事件绑定方法的时候,触发子元素身上的事件,执行完毕之后,也会触发父级元素相同的事件,这种机制叫事件冒泡

    取消事件冒泡:

      event.stopProPagation?event.stoppropagation():event.cancelbubble=true;

    事件捕获:

      给父子元素用addeventlistener()绑定同一事件时,当触发子元素身上的事件时,先触发父元素,然后在传递给子元素,这种传播机制叫事件捕获;

      给一个元素绑定事件,普通写法(dom0级)---

        obj.onclick=function(){}  后者会覆盖掉前者

      事件绑定第二种写法:(dom2级)---

        标准:addeventlistener

        非标准:attach

      addeventlistener(参数1,参数2,参数3)

        参数1:事件名,  参数2:事件函数  参数3:布尔值,(是否捕获,默认false,不捕获但是冒泡)

      IE低版本没有捕获

      普通事件写法没有捕获(会覆盖)

    addeventlistener和attachevent二者区别:

      addeventlistener            attachevent

        事件名不带on              事件名带on

        this指向当前元素            this指向window

        标准浏览器                IE低版本

        有冒泡有捕获              只有冒泡

    call和apply:

      改变函数内this指向  xxx.call()      xxx.apply()

      call()中的第一个参数是null的时候,函数里面的this是指向原来的,不变

    *所有事件都是异步的

  • 相关阅读:
    python线程详解
    Beego框架在模板中使用自定义函数
    golang打印英文格式时间日期
    如何让SQL语句不执行默认排序,而是按照in语句的顺序返回结果
    Git clone 报错 Unable to negotiate with xxx.xxx.xxx.xxx port 12345: no matching cipher found. Their offer: aes128-cbc,3des-cbc,blowfish-cbc
    Mysql去掉html标签函数
    Nodejs的npm安装模块时候报错:npm ERR! Error: CERT_UNTRUSTED的解决方法
    树莓派使用DHT11温湿度传感器
    ubuntu源列表(清华,阿里,官方,选一即可)
    将tgz文件解压到指定目录
  • 原文地址:https://www.cnblogs.com/xiaotaiyangye/p/10154593.html
Copyright © 2011-2022 走看看