• 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 规定事件包括三个阶段,事件捕获,处于目标阶段、事件冒泡。

    事件冒泡

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

    事件捕获

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

  • 相关阅读:
    【凡尘】---react-redux---【react】
    React生命周期详解
    写文章很难,ai自动生成文章为你来排忧
    怎么用ai智能写作【智媒ai伪原创】快速写文章?
    给大家介绍个Seo伪原创工具吧,可以免费用的哈
    自媒体文章难写,在线伪原创文章生成就简单了
    内容创作难吗 不妨试试智媒ai伪原创
    Ai伪原创工具,轻松几秒出爆文
    什么AI写作软件靠谱,好用?
    分享个免费伪原创工具 关键词自动生成文章
  • 原文地址:https://www.cnblogs.com/luckyjiu9/p/13663652.html
Copyright © 2020-2023  润新知