// 向 <div> 元素添加事件句柄
document.getElementById("myDIV").addEventListener("mousemove", myFunction); // 移除 <div> 元素的事件句柄
document.getElementById("myDIV").removeEventListener("mousemove", myFunction);

addEventListener() 方法用于向指定元素添加事件句柄。

element.addEventListener(event, function, useCapture)  //语法

useCapture:可选。布尔值,指定事件是否在捕获或冒泡阶段执行。

  • true - 事件句柄在捕获阶段执行
  • false- false- 默认。事件句柄在冒泡阶段执行

事件捕获阶段capture phase,传播顺序:window -> 事件源的父元素.  The event object must propagate through the target's ancestors from the Window to the target's parent.

事件冒泡阶段bubble phase,传播顺序:事件源父元素 -> window.  The event object propagates through the target’s ancestors in reverse, starting with the target's parent and ending with the Window.

目标阶段target phase:事件对象到达事件源。The event object arrive at the event object's event target.

可参考相关文章 : https://www.cnblogs.com/zhuzhenwei918/p/6139880.html

http://blog.csdn.net/qq_28602957/article/details/60475123

JavaScript事件起泡与捕获的更多相关文章

  1. JavaScript事件——冒泡、捕获

    本节要点:1.干预系统的事件处理机制 (一)DOM事件流 (二)停止事件冒泡 (三)阻止事件的默认行为 1.干预系统的事件处理机制 (一)DOM事件流 DOM模型是一个树形结构,在DOM模型中,HTM ...

  2. [JS学习笔记]Javascript事件阶段:捕获、目标、冒泡

    当你在浏览器上点击一个按钮时,点击的事件不仅仅发生在按钮上,同时点击的还有这个按钮的容器元素,甚至也点击了整个页面. 事件流 事件流描述了从页面接收事件的顺序,但在浏览器发展到第四代时,浏览器开发团队 ...

  3. JavaScript事件冒泡与捕获

    event.preventDefault();    如果event.cancelable的值为true,可以取消默认事件 event.cancelable;             元素是否可以取消 ...

  4. JavaScript事件冒泡和捕获

    事件捕获指的是从document到触发事件的那个节点,即自上而下的去触发事件. 事件冒泡是自下而上的去触发事件. 绑定事件方法的第三个参数,就是控制事件触发顺序是否为事件捕获.true,事件捕获:fa ...

  5. [JavaScript] JavaScript事件注册,事件委托,冒泡,捕获,事件流

    面试题 event 事件 事件委托是什么? 如何阻止事件冒泡,阻止默认事件呢? Javascript 的事件流模型都有什么? 事件绑定和普通事件有什么区别? Event 对象 Event 对象,当事件 ...

  6. javaScript事件机制深入学习(事件冒泡,事件捕获,事件绑定方式,移除事件方式,阻止浏览器默认行为,事件委托,模拟浏览器事件,自定义事件)

    前言 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(或处理程序)来预订事件,以便事件发生时执行相应的代码.这种在传统软 ...

  7. JavaScript事件:事件处理模型(冒泡、捕获)、取消冒泡、阻止默认事件

    (一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div clas ...

  8. JavaScript事件捕获冒泡与捕获

    事件流 JavaScript中,事件流指的是DOM事件流. 概念 事件的传播过程即DOM事件流.事件对象在 DOM 中的传播过程,被称为"事件流".举个例子:开电脑这个事,首先你是 ...

  9. javascript --- 事件冒泡与事件捕获

    事件冒泡与事件捕获 事件冒泡和事件捕获分别由微软和网景公司提出,这两个概念都是为了解决页面中事件流(事件发生顺序)的问题.考虑下面这段代码,就不写html->head,body之类的代码了,自行 ...

随机推荐

  1. Atitit 热烈庆祝读经器项目圆满完成

    Atitit 热烈庆祝读经器项目圆满完成 1.1. 读经器项目简单介绍 1 1.2. 一万小时定律和十年一个专家定律 1 1.3. 获得加持前景 1 1.4. 核心源码 1 1.5. 项目git 2 ...

  2. Git把Tag推送到远程仓库

    # 创建附注标签 $ git tag -a v0.1.2 -m “0.1.2版本” 列出标签 $ git tag # 在控制台打印出当前仓库的所有标签 $ git tag -l ‘v0.1.*’ # ...

  3. 【原创 Hadoop&Spark 动手实践 9】Spark SQL 程序设计基础与动手实践(上)

    [原创 Hadoop&Spark 动手实践 9]SparkSQL程序设计基础与动手实践(上) 目标: 1. 理解Spark SQL最基础的原理 2. 可以使用Spark SQL完成一些简单的数 ...

  4. php项目踩到的empty函数的一个坑

    报错信息: PHP Fatal error: Can't use function return value in write context in /目录省略.../XXService.php on ...

  5. [转]Mybatis foreach 批量操作

    原文地址:https://blog.csdn.net/jason5186/article/details/40896043 foreach属性属性    描述item    循环体中的具体对象.支持属 ...

  6. AI人工智能顶级实战工程师 课程大纲

    课程名称    内容    阶段一.人工智能基础 — 高等数学必知必会     1.数据分析    "a. 常数eb. 导数c. 梯度d. Taylore. gini系数f. 信息熵与组合数 ...

  7. c++中为什么可以通过指针或引用实现多态,而不可以通过对象呢?

    引言:  在c++中司空见惯的事情就是:可以通过指针和引用可以实现多态,而对象不可以.  那为什么?让我们来解开这神秘的暗纱! 1. 类对象的存储方式: 在一个类的实例中,只会存放非静态的成员变量. ...

  8. 基于【CentOS-7+ Ambari 2.7.0 + HDP 3.0】搭建HAWQ数据仓库01 —— 准备环境,搭建本地仓库,安装ambari

    一.集群软硬件环境准备: 操作系统:  centos 7 x86_64.1804 Ambari版本:2.7.0 HDP版本:3.0.0 HAWQ版本:2.3.05台PC作为工作站: ep-bd01 e ...

  9. LiDAR、LAS、LAS Dataset与点云

    LiDAR Light Detection And Ranging,激光探测及测距,是一种光学遥感技术,使用激光对地球表面的密集采样,产生高精度X.Y.Z测量值. 激光雷达系统的主要硬件组成部分包括一 ...

  10. Java不区分大小写的CaseInsensitiveMap

    Java中对于键值对,我们习惯使用类HashMap,使用方式:Map<String, String> result=new HashMap<String,String>(); ...