一个非常简单的例子告诉你attachEvent和addEventListener的区别
<input id="test" type="button" value="测试">
<script>
var test = document.getElementById("test"); if(test.addEventListener){
test.addEventListener("click",function(){
alert(this.id + "1");
})
test.addEventListener("click",function(){
alert(this.id + "2");
})
test.addEventListener("click",function(){
alert(this.id + "3");
})
}else{
test.attachEvent("onclick",function(){
alert(1);
})
test.attachEvent("onclick",function(){
alert(2);
})
test.attachEvent("onclick",function(){
alert(this.id);
})
}
</script>
代码很简单,不解释。
IE6输出结果:undefined,2,1。不管点多少次都那样!
IE10输出结果:test1,test2,test3
结论:
执行顺序:attachEvent是逆序,addEventListener是正序。
参数:attchEvent要带上on,addEventListener还多了useCapture,就是在捕捉阶段就能触发。第三个参数看这里:http://www.cnblogs.com/loveyouyou616/p/3916345.html.
作用域:attchEvent使用的是window域,所以输出id的时候为undefined,addEventListener使用的是标签的域。
一个非常简单的例子告诉你attachEvent和addEventListener的区别的更多相关文章
- netty-1.从一个最简单的例子开始
(原) 第一篇,从一个最简单的例子开始 1.netty是干什么,怎么用,这里不作介绍,先从一个例子来了解它, netty 5.0以上的版本被废弃了,以下例子从4.1.10.Final版本开始. 2.一 ...
- attachEvent与addEventListener的区别 真实例子
转自:https://www.cnblogs.com/Rosefxd/p/4921330.html 近日遇到attachEvent与addEventListener两个事件,哟,果断研究一下~~ 先普 ...
- js 添加事件 attachEvent 和 addEventListener 的区别
1.addEventListener 适用w3c标准方法addEventListener绑定事件,如下,事件的执行顺序和绑定顺序一致,执行顺序为method1->method2->meth ...
- [编译] 1、第一个makefile简单例子
前言 本篇用一个最简单的例子引入makefile,教你编写第一个makefile 正文 在Download/aa文件夹下有a.c和makefile文件 litao@litao:~/Downloads/ ...
- 为什么C语言在2013年仍然很重要:一个简单的例子
附注:在最初的文章里,我没说明进行模2^64的计算——我当然明白那些不是“正确的”斐波那契数列,其实我不是想分析大数,我只是想探寻编译器产生的代码和计算机体系结构而已. 最近,我一直在开发Dynvm— ...
- 一个简单的例子理解Kubernetes的三种IP地址类型
很多Kubernetes的初学者对Kubernetes里面三种不同的IP地址和工作机制理解得不是很清楚. 本文我们通过一个最简单的例子来学习. 用如下命令行创建一个基于nginx的deployment ...
- attachEvent和addEventListener区别总结
1.attachEvent与addEventListener的区别 支持的浏览器不同.attachEvent在IE9以下的版本中受到支持.其它的都支持addEventListener. 参数不同.ad ...
- Spring-Context之一:一个简单的例子
很久之前就想系统的学习和掌握Spring框架,但是拖了很久都没有行动.现在趁着在外出差杂事不多,就花时间来由浅入深的研究下Spring框架.Spring框架这几年来已经发展成为一个巨无霸产品.从最初的 ...
- 扩展Python模块系列(二)----一个简单的例子
本节使用一个简单的例子引出Python C/C++ API的详细使用方法.针对的是CPython的解释器. 目标:创建一个Python内建模块test,提供一个功能函数distance, 计算空间中两 ...
随机推荐
- Spark操作HBase问题:java.io.IOException: Non-increasing Bloom keys
1 问题描述 在使用Spark BulkLoad数据到HBase时遇到以下问题: 17/05/19 14:47:26 WARN scheduler.TaskSetManager: Lost task ...
- 软件工程期末考试 AHNU
1. 数据流图:一种图形化技术,它描绘信息流和数据从输入移动到输出的过程中所经受的变换.在数据流图中没有任何具体的物理部件,它只是描绘数据在软件中流动和被处理的逻辑过程,是系统逻辑功能的图形 ...
- Two Sum 2015年6月8日
Given an array of integers, find two numbers such that they add up to a specific target number. The ...
- Spring Cloud 客服端负载均衡 Ribbon
一.简介 Spring Cloud Ribbon 是一个基于Http和TCP的客服端负载均衡工具,它是基于Netflix Ribbon实现的.它不像服务注册中心.配置中心.API网关那样独立部署, ...
- spring-线程池(3)
一.初始化 1,直接调用 import java.util.concurrent.ThreadPoolExecutor.CallerRunsPolicy; import org.springframe ...
- Java ClassLoader 原理分析
一.ClassLoader(类加载器)的作用 如果一个程序包含不止一个class文件,那么当程序启动时,带有main方法的类的class文件作为程序入口先被JVM加载,然后根据程序调用的需要,再逐步进 ...
- centos 修改主机映射
[root@m1 ~]# vi /etc/hosts
- Spring读取xml配置文件的原理与实现
本篇博文的目录: 一:前言 二:spring的配置文件 三:依赖的第三方库.使用技术.代码布局 四:Document实现 五:获取Element的实现 六:解析Element元素 七:Bean创造器 ...
- 基于HTML5 Canvas 实现弹出框
用户鼠标移入时,有弹出框出现,这样的需求很常见.这在处理HTML元素实现时简单,但是如果是对HTML5 Canvas 构成的图形进行处理,这种方法不再适用,因为Canvas使用的是另外一套机制,无论在 ...
- Java IO流之打印流与标准流
一.打印流 1.1打印流特点与构造方法 1)PrintStream和PrintWriter类都提供了一系列重载的print和println方法来输出各种类型的数据. 2)PrintStream和Pri ...