javascript中的addEventListener与attchEvent

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及更早版本的浏览器只支持冒泡事件，不支持捕获，故不存在第三个参数的设置

时间： 2024-11-08 20:35:32

javascript中的addEventListener与attchEvent的相关文章

javascript中查看元素事件函数的一些技巧

在分析一些网页的时候,经常会发现点击某个按钮会触发某个动作,当页面比较复杂,包含的js文件又多,这时候要找到这段触发函数的代码写在哪里就比较困难.比如,在某个html页面中,发现如下一个按钮,点击后会使得页面元素有变化.但是并未看到onclick事件,那说明该事件可能是通过javascript中的addEventListener方法绑定的(IE不支持该方法,使用的是attachEvent,不理解为微软何非要和W3C标准对着干).例如下面的代码: <input type="button&qu

JavaScript中事件的绑定

JavaScript中的addEventListener()函数大多数浏览器都可以正常使用,但是却不兼容IE8及其以下的浏览器,所以我们可以自定义一个专门用于绑定事件的函数bind(),无论是什么浏览器,都可以正常使用. 在这个函数中,需要使用到IE专用的attachEvent()函数,需要传递的形参分别是:需要绑定事件的对象,绑定事件的名称,以及回调函数, function bind(obj, eventStr, callBack) { if (obj.addEventListener) {

javascript中addEventListener(attachEvent)详解

addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 "click"):第二个参数表示要接收事件处理的函数:第三个参数为 useCapture.例子如下: <button type="button">点击我</button> <img src="11 (6).jpg" alt="" style="display:block"> <s

javascript中attachEvent事件跟 addEventListener 事件

拷贝自 http://www.jb51.net/article/66111.htm 本文实例讲述了javascript中attachEvent用法.分享给大家供大家参考.具体分析如下: 一般我们在JS中添加事件,是这样子的 obj.onclick=method 这种绑定事件的方式,兼容主流浏览器,但如果一个元素上添加多次同一事件呢? ? 1 2 3 obj.onclick=method1 obj.onclick=method2 obj.onclick=method3 如果这样写,那么只有最后绑定

JavaScript中的回调函数

在学习JavaScript的过程中遇到了很多,使用到回调函数的例子,出现了许多疑问,就由一个栗子开始吧: 在JavaScript中接触的第一个回调函数是在setInterval()和setTimeout()中出现的: 1 var num = 10; 2 3 var interValId = setInterval(function (){ 4 console.log(num); 5 num--; 6 if(num==0){ 7 clearInterval(interValId); 8 } 9 }

JavaScript中事件绑定的方法总结

最近收集了一些关于JavaScript绑定事件的方法,汇总了一下,不全面,但是,希望便于以后自己查看. JavaScript中绑定事件的方法主要有三种: 1 在DOM元素中直接绑定 2 JavaScript代码中直接绑定 3 绑定事件监听函数一.在DOM元素中直接绑定也就是直接在html标签中通过 onXXX=“” 来绑定.举个例子: <input type="button" value="点我呦" onclick="alert("he

Javascript中this关键字详解

原文出处:http://www.cnblogs.com/justany/archive/2012/11/01/the_keyword_this_in_javascript.html Quiz 请看下面的代码,最后alert出来的是什么呢? 1 var name = "Bob"; 2 var nameObj ={ 3 name : "Tom", 4 showName : function(){ 5 alert(this.name); 6 }, 7 waitShowNa

javascript中的事件

在javascript中的事件有三个方面的知识,一是事件流,二是事件处理程序,三是事件对象.下面就我个人的一点理解,分别讲述一下这三个方面的内容. 第一.事件流事件流指的是事件按照一定的顺序触发.它有两个顺序,分别是自上而下和自下而上. 自上而下的叫做事件捕获,事件捕获指的是事件的处理将从DOM层次的根开始,而不是从触发事件的目标元素开始,事件被从目标元素的所有祖先元素依次往下传递.在这个过程中,事件会被从文档根到事件目标元素之间各个继承派生的元素所捕获,如果事件监听器在被注册时设置了useC

javascript中常用的事件绑定方法

我们要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有三种常用的绑定事件的方法: 在DOM元素中直接绑定: 在JavaScript代码中绑定: 绑定事件监听函数. 一. 在DOM元素中直接绑定这里的DOM元素,可以理解为HTML标签.JavaScript支持在标签中直接绑定事件,语法为: onXXX="JavaScript Code" 其中