一个非常简单的例子告诉你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, 计算空间中两 ...
随机推荐
- 第 8 章 MySQL 数据库 Query 的优化
前言: 在之前“影响 MySQL 应用系统性能的相关因素”一章中我们就已经分析过了Query语句对数据库性能的影响非常大,所以本章将专门针对 MySQL 的 Query 语句的优化进行相应的分析. ...
- 开涛spring3(12.3) - 零配置 之 12.3 注解实现Bean定义
12.3 注解实现Bean定义 12.3.1 概述 前边介绍的Bean定义全是基于XML方式定义配置元数据,且在[12.2注解实现Bean依赖注入]一节中介绍了通过注解来减少配置数量,但并没有完全 ...
- tab切换插件开发
我开发的tab切换插件,基于jquery库,实现tab标签页的切换.插件的名称为jquery.tabSwitch.js. 插件实现代码如下: ; (function ($) { $.fn.tabSwi ...
- 用2D动画做遮罩
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- mac下eclipse安装svn插件-subclipse
目前Eclipse最常用的svn插件莫非subclipse,在windows系统下的安装svn client和subclipse比较简单.本文介绍如何在mac安装svn插件和subclipse. 一. ...
- Linux Namespaces机制
转自:http://www.cnblogs.com/lisperl/archive/2012/05/03/2480316.html Linux Namespaces机制提供一种资源隔离方案.PID,I ...
- ELK菜鸟手记 (四) - 利用filebeat和不同端口把不同服务器上的log4j日志传输到同一台ELK服务器
1. 问题描述 我们需要将不同服务器(如Web Server)上的log4j日志传输到同一台ELK服务器,介于公司服务器资源紧张(^_^) 2. 我们需要用到filebeat 什么是filebeat ...
- Java-面向对象总结
下面是学习面向对象的知识点和总结: 面向对象思想: 遇到需求,首先去找是否有现成的类来实现此功能,创建对象来调用,以此来组合成新的类实现自己的需求. 在java中是以类为单位,一个类包括成员变量.成员 ...
- 在linux中导入sql文件的方法分享(使用命令行转移mysql数据库)
因导出sql文件 在你原来的网站服务商处利用phpmyadmin导出数据库为sql文件,这个步骤大家都会,不赘述. 上传sql文件 前面说过了,我们没有在云主机上安装ftp,怎么上传呢? 打开ftp客 ...
- DDD理论学习系列(6)-- 实体
DDD理论学习系列--案例及目录 1.引言 实体对应的英语单词为Entity.提到实体,你可能立马就想到了代码中定义的实体类.在使用一些ORM框架时,比如Entity Framework,实体作为直接 ...