1、addEventListener

该方法用于向指定元素添加事件句柄

浏览器的支持情况为chrome1.0、ie9+、fireFox1.0、opera7.0

该方法包含三个参数event, function, useCapture

event为指定事件名，不需要加"on"前缀

function为事件触发时执行的函数

useCapture指定事件是否在捕获或冒泡阶段执行，true表示事件在捕获阶段执行，false表示在冒泡阶段执行（当目标元素与祖先元素定义了相同的事件，如点击事件，点击目标元素时若是事件捕获会先出发祖先元素的点击事件，再触发目标元素的点击事件，而事件冒泡则相反会先触发目标元素事件，再触发祖先元素事件）

2、attachEvent

功能与addEventListener方法相同，只是适用于ie8及更早版本的浏览器和opera7.0及更早的版本

该方法包含两个参数event，function

event为指定事件名，需要加"on"前缀

function为事件触发时执行的函数

由于ie8及更早版本的浏览器只支持冒泡事件，不支持捕获，故不存在第三个参数的设置

javascript中的addEventListener与attchEvent的更多相关文章

  1. javascript中标准事件流addEventListener介绍

    addEventListener-开始 前面零散地写了些关于 addEventListener 的内容,觉得比较散,有些地方可能也说得不够清楚明白,所以决定以连载的形式从头到尾再写一篇. addEve ...

  2. 关于javascript中的this关键字

    this是非常强大的一个关键字,但是如果你不了解它,可能很难正确的使用它. 下面我解释一下如果在事件处理中使用this. 首先我们讨论一下下面这个函数中的this关联到什么. function doS ...

  3. CSS3和javascript中的transform

    在javascript中,WebkitTransform 大概相当于 transform .transform 为标准,WebkitTransform 适用于Webkit浏览器.js中的WebkitT ...

  4. JavaScript中的this陷阱的最全收集

    JavaScript来自一门健全的语言,所以你可能觉得JavaScript中的this和其他面向对象的语言如java的this一样,是指存储在实例属性中的值.事实并非如此,在JavaScript中,最 ...

  5. javascript中函数的3个高级技巧

    × 目录 [1]作用域安全 [2]惰性载入 [3]函数绑定 前面的话 函数对任何一门语言来说都是一个核心的概念,在javascript中更是如此.前面曾以深入理解函数系列的形式介绍了函数的相关内容,本 ...

  6. 深入理解javascript中的焦点管理

    × 目录 [1]焦点元素 [2]获得焦点 [3]失去焦点[4]焦点事件 前面的话 焦点作为javascript中的一个重要功能,基本上和页面交互都离不开焦点.但却少有人对焦点管理系统地做总结归纳.本文 ...

  7. javascript中的一些核心知识点以及需要注意的地方

    前言 近期杂事甚多,这些事情的积累对知识体系的提升有好处,但是却不能整理出来,也整理不出来 比如说我最近研究的Hybrid在线联调方案便过于依赖于业务,就算分享也不会有人读懂,若是抽一点来分享又意义不 ...

  8. [No000069]Javascript中this关键字详解

    Quiz 请看下面的代码,最后alert出来的是什么呢?(chrome下按F12,选择Console直接复制粘贴运行) var name = "Bob"; var nameObj ...

  9. JavaScript中的this陷阱的最全收集 没有之一

    当有人问起你JavaScript有什么特点的时候,你可能立马就想到了单线程.事件驱动.面向对象等一堆词语,但是如果真的让你解释一下这些概 念,可能真解释不清楚.有句话这么说:如果你不能向一个6岁小孩解 ...

随机推荐

  1. WebExtensions & tabs.executeScript()

    tabs.executeScript() https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs ...

  2. jQuery实现三级联动

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. 将下载到本地的JAR包手动添加到Maven仓库(转)

    常用Maven仓库网址:http://mvnrepository.com/http://search.maven.org/http://repository.sonatype.org/content/ ...

  4. Go语言【第九篇】：Go数据结构之：数组

    Go语言数组 Go语言提供了数组类型的数据结构.数组时具有相同唯一类型的一组已编号且长度固定的数据项序列,中类型可以是任意的原始类型如整形.字符串或者自定义类型. 相对于声明number0,numbe ...

  5. CentOS 设置环境变量

    1. 查看环境变量,echo 命令用于在终端输出字符串或变量提取后的值,格式为“echo [字符串 | $变量]” echo $PATH /usr/local/bin:/usr/bin:/usr/lo ...

  6. 用Docker搭建Nexus私服

    搜索Nexus 在docker容器中加载Nexus镜像 发布本地项目到Nexus私服 配置连接方式 发布指令 打源码包上传插件 搜索Nexus   在我们打算使用Nexus时,我们先搜索一下docke ...

  7. [Leetcode] single number 找单个数

    Given an array of integers, every element appears twice except for one. Find that single one. Note:  ...

  8. 【系统设计】432. 全 O(1) 的数据结构

    题目: 使用栈实现队列的下列操作: push(x) -- 将一个元素放入队列的尾部. pop() -- 从队列首部移除元素. peek() -- 返回队列首部的元素. empty() -- 返回队列是 ...

  9. getElementsByClassName的原生实现

    DOM 提供了一个名为 getElementById() 的方法,这个方法将返回一个对象,这个对象就是参数 id 所对应的元素节点.另外,getElementByTagName() 方法会返回一个对象 ...

  10. 在Linux系统的服务器上使用Memtester进行内存压力测试

    最近要测试一台机器的整体性能情况,就在google搜索一番,发现这个一个小工具,说是可以进行内存的压力测试,Memtester主要是捕获内存错误和一直处于很高或者很低的坏位, 其测试的主要项目有随机值 ...