js 添加事件 attachEvent 和 addEventListener 的区别
1、addEventListener
适用w3c标准方法addEventListener绑定事件,如下,事件的执行顺序和绑定顺序一致,执行顺序为method1->method2->method3
//element.addEventListener(type,listener,useCapture);btn1Obj.addEventListener("click",method1,false);btn1Obj.addEventListener("click",method2,false);btn1Obj.addEventListener("click",method3,false);
2、attachEvent
在IE8及以下版本中,不支持addEventListener,只能用attachEvent绑定事件,执行顺序是 method3->method2->method1
//object.attachEvent(event,function);btn1Obj.attachEvent("onclick",method1);btn1Obj.attachEvent("onclick",method2);btn1Obj.attachEvent("onclick",method3);
3、属性赋值法绑定事件
适用该方法会使后绑定的方法覆盖前面的方法,要想一次性绑定多个(一次性执行多个操作,可以再一个事件中调用多个方法)
obj.onclick=method1;obj.onclick=method2;obj.onclick=method3;
一次性绑定多个:
obj.onclick=function (){method1();method2();method3();}
js 添加事件 attachEvent 和 addEventListener 的区别的更多相关文章
- js 添加事件 attachEvent 和 addEventListener 的用法
一般我们在JS中添加事件,是这样子的 ? 1 obj.onclick=method 这种绑定事件的方式,兼容主流浏览器,但如果一个元素上添加多次同一事件呢? ? 1 2 3 obj.onclick=m ...
- js添加事件 attachEvent 和addEventListener的用法
一般我们在JS中添加事件,是这样子的: obj.onclick = method 这种绑定事件的方式,兼容主流浏览器,但是如果一个元素上添加多次同一个事件呢??? obj.onclick = meth ...
- js中添加事件 attachEvent 与 addEventListener
给元素添加事件时,使用js进行实现时产生了疑惑,有关事件浏览器兼容的问题,在此记录如下. <!DOCTYPE html> <html> <head> <met ...
- js添加事件通用方法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- js添加事件监听的方式与this
js添加事件监听与this js添加事件监听的方式与this 在标签中调用自定义函数 DOM0级事件处理程序 DOM2级事件处理程序 this 代表谁? js添加事件监听的方式与this <di ...
- IE9 添加事件DOMContentLoaded,方法addEventListener
IE9 新添加 事件DOMContentLoaded,方法addEventListener
- js绑定事件方法:addEventListener与attachEvent的不同浏览器的兼容性写法
js的事件绑定方法中,ie仅仅支持attachEvent,而FF和Chrome仅仅支持addEventListener,所以就必须为这两个方法做兼容处理,原理是先推断attachEvent仅仅否为真( ...
- JS添加事件和解绑事件:addEventListener()与removeEventListener()
作用: addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作. 它们都接受3个参数:事件名.事件处理的函数和布尔值. 布尔值参数是true ...
- attachEvent与addEventListener的区别 真实例子
转自:https://www.cnblogs.com/Rosefxd/p/4921330.html 近日遇到attachEvent与addEventListener两个事件,哟,果断研究一下~~ 先普 ...
随机推荐
- 在ASP.NET Core中如何支持每个租户数据存储策略的数据库
在ASP.NET Core中如何支持每个租户数据存储策略的数据库 不定时更新翻译系列,此系列更新毫无时间规律,文笔菜翻译菜求各位看官老爷们轻喷,如觉得我翻译有问题请挪步原博客地址 本博文翻译自: ht ...
- lambda表达式杂谈
var personInfo = [ { name: "张三", age: 20, gender: "male" }, { name: "李四&quo ...
- Intellij idea史上最简单的教程之Linux下安装与破解Intellij idea2017
一.前言 这一节我们介绍在Linux下如何安装与破解Intellij idea2017.现在有很多公司开发环境都是Linux,所以掌握在Linux环境下使用Idea办公也是咱们必须得掌握的技能. 记住 ...
- C++格式化硬盘程序
#include using namespace std; //声明命名空间 void main() { char format[12]="format", name[10], ...
- Python自学笔记-paramiko模块(Mr serven)
文章出处:http://www.cnblogs.com/wupeiqi/articles/5095821.html SSHClient 用于连接远程服务器并执行基本命令 基于用户名密码连接: #!/u ...
- HDU1212
大数MOD #include<cstdio> #include<cstdlib> #include<iostream> #include<algorithm& ...
- zoj 1874 水题,输出格式大坑
Primary Arithmetic Time Limit: 2 Seconds Memory Limit: 65536 KB Children are taught to add mult ...
- Java面向对象 Object类 内部类
Java面向对象 Object类 内部类 知识概要: 一:Object类 二:内部类 匿名内部类的写法 1.Object O ...
- Windows 10「设置」应用完整MS-Settings快捷方式汇总
分类 设置名称 快捷方式 系统 显示 ms-settings:display 通知和操作 ms-settings:notifications 平板电脑模式 ms-settings:tabletmode ...
- win10 uwp 异步进度条
本文主要讲我设计的几个进度条,还有如何使用异步控制进度条,如何使用动画做进度. 进度条可以参见:http://edi.wang/post/2016/2/25/windows-10-uwp-modal- ...