zoukankan      html  css  js  c++  java
  • js事件监听和事件模型

    js事件监听

    事件监听的定义

    在Javascript中,浏览器一般分为两大类:

    ① 基于IE内核的浏览器(版本号小于9的IE浏览器)

    ② 基于W3C内核的浏览器(版本号大于9的IE浏览器、Firefox、Google等浏览器)

    基本语法:基于IE内核浏览器

    dom对象.attachEvent(type,callback,capture) :为元素绑定事件监听程序

    参数说明:

    type:绑定的事件类型,如onclick、onmouseover、onmouseout

    callback:事件的处理程序,通常是一个匿名函数

    capture:使用的浏览器模型,冒泡模型与捕获模型,默认IE8以下的浏览器只支持冒泡模型!

    基本语法:基于W3C内核的事件监听

    dom对象.addEventListener(type,callback) :为W3C内核浏览器绑定事件监听

    参数说明:

    type:绑定事件类型,不带’on’前缀,如click,mouseover,mouseout

    callback:事件的处理程序,通常是一个匿名函数

    总结事件监听的区别

    IE内核的监听方式与W3C内核的监听方式:

    ①方式不同

    IE内核的浏览器使用attachEvent进行绑定

    W3C内核的浏览器使用addEventListener进行绑定

    ②参数不同

    IE内核浏览器,其绑定方式一共有三个参数type,callback,capture(使用的浏览器模型)

    W3C内核浏览器,其绑定方式一共有二个参数,type和callback

    ③type参数不同

    IE内核的浏览器,type是需要添加’on’前缀的,如onclick

    W3C内核浏览器,type是不需要添加’on’前缀的,如click

    ④触发顺序不同

    IE内核的浏览器,其事件监听是先绑定后触发,后绑定的先触发

    W3C内核的浏览器,其事件监听是先绑定先触发,后绑定的后触发

    js事件模型

    事件

    用户与wed交互的瞬间就是事件

    事件流

    DOM 规定事件包括三个阶段,事件捕获,处于目标阶段、事件冒泡。

    事件冒泡

    微软提出
    就是由具体的元素逐级上传到较为不具体的节点,就像鱼从水底吐泡泡直到水面

    事件捕获

    网景提出
    与冒泡相反 由不具体的元素到较为具体的元素,就像网一样从水面沉到水底

  • 相关阅读:
    NSAttributedString可以强制转换为NSMutableAttributedString类型吗?下面这代码有什么问题 为什么报错
    jQuery中.bind() .live() .delegate() .on()的区别 和 三种方式写光棒事件 动画
    锋利的jQuery中的事件与动画
    使用jQuery快速高效制作网页交互特效
    Java中abstract和interface的区别
    一期结业KTV项目难点
    类和对象
    循环结构进阶
    Java中的数组
    Java初始化
  • 原文地址:https://www.cnblogs.com/luckyjiu9/p/13663652.html
Copyright © 2011-2022 走看看