事件

事件流描述的是从页面中接收事件的顺序。IE的事件流水事件冒泡流,而Netscape Commuication的事件流水事件捕获流。

  • 事件冒泡
  • 事件捕获

DOM事件流

”DOM2级事件“规定的事件流包括三个阶段:事件捕获阶段、处于目标阶段和事件冒泡阶段。

事件处理程序

  • HTML事件处理
  • DOM0级事件处理程序
  • DOM2级事件处理程序
    • addEventListener()
    • removeEventListener()
      都接受三个参数:要处理的事件名、作为事件处理程序的函数和一个布尔值。最后的布尔值参数如果是true,表示在捕获阶段调用事件处理程序;如果是false,表示在冒泡阶段调用事件处理程序。大多情况下选择false
    • 通过addEventListener()添加的事件处理程序只能使用removeEventListener()来移除。

事件对象

触发DOM上的某个事件,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息。event对象包含与创建它的特定事件有关的属性和方法,触发的事件类型不一样,可用的属性和方法也不一样。

要阻止特定事件的默认行为,可以使用preventDefault()方法。只有cancelable属性设置为true的事件,才可以使用preventDefaultfault()来取消其默认行为。另,stopPropagation()方法用于立即停止事件在DOM层次中的传播,即取消进一步的事件捕获或冒泡。

事件对象的eventPhase属性,可以用来确定事件当前正位于事件流的哪个阶段。如eventPhase等于1,处于捕获阶段;如eventPhase等于2,则处于目标对象上;如eventPhase等于3,则处于冒泡阶段。

IE中的事件处理和事件对象都有所不同。

事件类型

  • UI事件
  • 焦点事件
  • 鼠标事件
  • 滚轮事件
  • 文本事件
  • 键盘事件
  • 合成事件
  • 变动事件

推荐阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,286评论 1 11
  • JavaScript 程序采用了异步事件驱动编程模型。在这种程序设计风格下,当文档、浏览器、元素或与之相关的对象发...
    劼哥stone阅读 1,139评论 3 11
  • 事件流 JavaScript与HTML之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互...
    DHFE阅读 626评论 0 3
  • JavaScript 与 HTML 之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互瞬...
    threetowns阅读 225评论 0 0
  • js之事件机制 1、事件初探 1.1 js事件的概述 JavaScript事件:JavaScript是基于事件驱动...
    道无虚阅读 1,899评论 1 3