jQuery技术

jQuery学习4:浏览器的事件模型

字号+ 作者:H5之家 来源:H5之家 2017-10-07 14:02 我要评论( )

首先要知道DOM的两级模式: DOM0级 和 DOM2级 在 DOM0级 事件处理程序是通过把函数实例的引用指派到DOM元素的属性而声明的。 声明DOM第0级事件处理程序: !DOCTY

首先要知道DOM的两级模式:DOM0级DOM2级

DOM0级事件处理程序是通过把函数实例的引用指派到DOM元素的属性而声明的。

声明DOM第0级事件处理程序:


提示:可修改后代码再运行!

事件冒泡:在目标元素获得机会处理事件之后,事件模型检查目标元素的父元素,看是否为同类型事件建立了处理程序。如果是,则也调用父元素的处理程序。再检查其父元素,直至检查到DOM树的顶部,这个过程称之为事件冒泡。


提示:可修改后代码再运行!

DOM第2级事件模型

DOM第0级的缺点是,属性被用于存储作为事件处理程序的函数的引用,所以每个元素对于任何特定的事件类型,每次只能注册一个事件处理程序。

DOM第2级事件模型(也称为监听器)被设计来解决这些类型的问题。每个DOM元素都定义名为addEventListener()的方法,用于把事件处理程序(监听器)附加到元素上。这个方法的格式如下所示:

addEventListener(enentType,listener,useCapture)

参数eventType是一个字符串,用于标识将要处理的时间类型。例如:click、mouseover、keydown等。

参数listener是函数的引用(或内联函数),用于在元素上建立指定类型的处理程序。

参数useCapture是布尔类型。


提示:可修改后代码再运行!

以上代码简单说明我们能在同一个元素上为同一个事件类型建立多个事件处理程序。

作者博客:

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • jQuery学习笔记(三)_ jQuery事件

    jQuery学习笔记(三)_ jQuery事件

    2017-10-01 18:04

  • JQuery之事件

    JQuery之事件

    2017-09-05 17:14

  • jQuery学习笔记(事件)

    jQuery学习笔记(事件)

    2017-08-05 12:00

  • jquery技巧总结-jQuery对象,集合,方法扩展,事件处理,特效,解决冲突

    jquery技巧总结-jQuery对象,集合,方法扩展,事件处理,特效,解决冲突

    2017-08-04 15:01

网友点评