监听事件方法:addEventListener(<event-name>, <callback>, <use-capture>)

移除监听事件方法:removeEventListener(event, function)

其中 addEventListener(event, function, useCapture) 有三个参数,分别代表:

第一个参数 event-name (String):所要监听的事件名称或类型,

  如:鼠标事件(mousedown, mouseup, mousemove, mouseover, mouseout, mouseclick, dblclick 等)

    键盘事件(keydown, keyup, keypress 等)

    等用户触发的事件

第二个参数 callback (function):监听到事件后所要执行的操作,即事件触发时的回调

第三个参数 use-capture (boolean):决定事件在哪个阶段被触发并执行相应的回调函数

  false:冒泡阶段触发,true: 捕获阶段触发。默认值是 false,即冒泡触发

冒泡:内部元素的事件会先被触发,然后再触发外部元素(子元素先触发,父元素再触发)。由内及外

捕获:外部元素的事件会先被触发,然后才会触发内部元素的事件(父元素先触发,子元素再触发)。由外到内

  

addEventListener(event, function, useCapture) 简记的更多相关文章

  1. addEventListener event

    addEventListener   先看个例子: document.getElementById("myBtn").addEventListener("click&qu ...

  2. autoHeight # 动态高度添加 用 window.addEventListener('resize', function () {

    动态高度添加 用 window.addEventListener('resize', function () { mounted () { this.init() window.addEventLis ...

  3. dom addeventlistener与id 绑定事件的区别

    文档中有写. //addEventListener() 方法用于向指定元素添加事件句柄. //提示: 使用 removeEventListener() 方法来移除 addEventListener() ...

  4. Javascript addEventListener dispatchEvent

    测试代码:分别在嵌套的元素body,div#level1,div#level2,div#level3上附加事件,仅在chrome中测试通过. <!DOCTYPE html> <htm ...

  5. addEventListener与removeEventListener

    addEventListener:添加事件监听器 element.addEventListener(event, function, useCapture) event:事件类型,字符串,不要加&qu ...

  6. [转]addEventListener() 方法,事件监听

    转载  白杨-M  http://www.cnblogs.com/baiyangyuanzi/p/6627401.html addEventListener() 方法,事件监听 你可以使用 remov ...

  7. addEventListener() 方法,事件监听

    知识点1:addEventListener() 方法,事件监听,可以使用 removeEventListener() 方法来移除事件的监听. 语法 element.addEventListener(e ...

  8. JS之event flow

    DOM事件流 1.定义: DOM(文档对象模型)结构是一个树型结构,当一个HTML元素产生一个事件时,该事件会在元素节点与根结点之间的路径传播,路径所经过的结点都会收到该事件,这个传播过程可称为DOM ...

  9. HTML DOM addEventListener() 方法

    实例 为 <button> 元素添加点击事件. 当用户点击按钮时,在 id="demo" 的 <p> 元素上输出 "Hello World&quo ...

随机推荐

  1. C# 进程通信SendMessage和有关消息参数

    SendMessage是啥? 函数原型: LRESULT SendMessage(HWND hWnd,UINT Msg,WPARAM wParam,LPARAM IParam)SendMessage( ...

  2. Locust HTTP client

    Http client 默认是以安全模式运行的,任何由于连接错误.超时或者类似错误引起的异常,都会返回一个空的Response对象,这个请求将会再locust统计中标记为failure,返回的虚拟对象 ...

  3. this和target目标对象的区别

    在事件函数中 event.target和this是一样的效果吗? this是调用方法的对象, evemt.target事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素.文档或窗口. ...

  4. TypeScript学习小结

    TypeScript是什么 TypeScript是由微软公司开发的一个开源JavaScript的超集,主要提供了类型系统和对ES6的支持,可以编译成纯JavaScript,主要就是对JavaScrip ...

  5. java se系列(十一)线程

    1 线程的概述 进程:正在运行的程序,负责了这个程序的内存空间分配,代表了内存中的执行区域. 线程:就是在一个进程中负责一个执行路径. 多线程:就是在一个进程中多个执行路径同时执行. 图上的一键优化与 ...

  6. Python - 三级菜单优化方法 (单层循环)

    menu = {...... } current_layer = menu layers = [] while True: for k in current_layer: print(k) choic ...

  7. 前端中用到的图片(png图片)

    作为前端工程师,将设计师的设计稿转化为html页面,其中有一个必不可少的环节就是将psd文件中的一些图片随心所欲的使用,而我们经常用到的就是png图片. 第一部分:基本介绍 首先我们先对比几种图片: ...

  8. 2019美国大学生数学建模竞赛B题(思路)

    建模比赛已经过去三天了,但留校的十多天里,自己的收获与感受依然长存于心.下面的大致流程,很多并没有细化,下面很多情况都是在假设下进行的,比如假设飞机能够来回运送药品,运货无人机就只运货,在最大视距下侦 ...

  9. JMeter元件的作用域与执行顺序

    元件的作用域 先来讨论一下元件有作用域.<JMeter基础元件介绍>一节中,我们介绍了8类可被执行的元件(测试计划与线程组不属于元件),这些元件中,取样器 是典型的不与其它元件发生交互作用 ...

  10. c++ 网络编程(四) LINUX/windows下 socket 基于I/O复用的服务器端代码 解决多进程服务端创建进程资源浪费问题

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/9613861.html 好了,继上一篇说到多进程服务端也是有缺点的,每创建一个进程就代表大量的运 ...