事件捕获跟冒泡

在dom的addEventListener() 方法中,参数有三个,

event表示事件名称,例如'click';

function表示执行的回调函数,当事件对象会作为第一个参数传入函数。 事件对象的类型取决于特定的事件。例如, "click" 事件属于 MouseEvent(鼠标事件) 对象;

useCapture表示指定事件是否在捕获或冒泡阶段执行——true - 事件句柄在捕获阶段执行

false:默认值,事件句柄在冒泡阶段执行。

js事件流有以下阶段:

DOM2级事件模型中规定了事件流的三个阶段:捕获阶段、目标阶段、冒泡阶段,低版本IE(IE8及以下版本)不支持捕获阶段

捕获事件流:Netscape提出的事件流,即事件由页面元素接收,逐级向下,传播到最具体的元素。

冒泡事件流:IE提出的事件流,即事件由最具体的元素接收,逐级向上,传播到页面。

使用removeEventListener() 方法来移除addEventListener()方法添加的事件句柄。

分别在window、document、html、body、btn上绑定事件,单击按钮,输出结果如下:

事件流表述
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,691评论 1 11
  • 以下文章为转载,对理解JavaScript中的事件处理机制很有帮助,浅显易懂,特分享于此。 什么是事件? 事件(E...
    jxyjxy阅读 3,169评论 1 10
  • JavaScript 程序采用了异步事件驱动编程模型。在这种程序设计风格下,当文档、浏览器、元素或与之相关的对象发...
    劼哥stone阅读 1,333评论 3 11
  • 事件流 JavaScript与HTML之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互...
    DHFE阅读 911评论 0 3
  • 宜 迷失 忌 辨识 窗外,下午四点多的南方夕阳收敛了刺眼的光落,出差的实习生在返城的路途上,车厢里稀稀落落的乘客,...
    小女子李明阅读 279评论 0 0

友情链接更多精彩内容