一个非常简单的例子告诉你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, 计算空间中两 ...
随机推荐
- 【2017-05-19】WebForm复合控件
自动提交的属性: AutoPostBack="True" 1.RadioButtonList 单选集合 -属性:RepeatDirection:Vertical (垂直排布 ...
- Opencv在linux下安装
Opencv in Linux These steps have been tested for Ubuntu 10.04 but should work with other distros as ...
- javaWeb学习总结(11)- 监听器(Listener)学习
一.监听器介绍 1.1.监听器的概念 监听器是一个专门用于对其他对象身上发生的事件或状态改变进行监听和相应处理的对象,当被监视的对象发生情况时,立即采取相应的行动.监听器其 实就是一个实现特定接口的普 ...
- 用户输入与while循环
函数input()的工作原理: 函数input()让程序短暂运行,等待用户输入一些文本,获取用户输入后将其存储在一个变量中 测试input()功能-- #!/usr/bin/env python#fi ...
- springboot 自定义Repository
启用 JpaRepositories package cn.xiaojf; import cn.xiaojf.today.data.rdb.repository.RdbCommonRepository ...
- 多媒体开发库 之 SDL 详解
SDL 简介 SDL(Simple DirectMedia Layer)是一套开放源代码的跨平台多媒体开发库,使用C语言写成.SDL提供了数种控制图像.声音.输出入的函数,让开发者只要用相同或是相似的 ...
- 网络编程应用:基于UDP协议【实现文件下载】--练习
要求: 基于UDP协议实现文件下载 发送方–请求–接收方发送文件–发送方接收文件 代码: 发送方: package Homework1; import java.io.File; import jav ...
- h5 + nginx + php 视频上传之突破文件大小受限的解决办法
一.环境: CentOS 6.8 nginx 1.8.0 php 7.0.10 二.背景 基于 nginx + php 的 h5 项目,上传视频的时候,如果视频太大,会上传失败. 三.正文 一份视频传 ...
- 创建对象的N种模式
1 new Object() 先创建一个Object实例,然后为它添加属性和方法 var Person = new Object() Person.name = 'hl' Person.sayName ...
- Java之戳中痛点 - (7)善用Java整型缓存池
先看一段代码: package com.test; import java.util.Scanner; public class IntegerCache { public static void m ...