首页 > 代码库 > DOM事件处理程序
DOM事件处理程序
addEventListener() 和 removeEventListener(),
所有 DOM 节点中都包含这两个方法,并且它们都接受 3 个参数:
- 要处 理的事件名、
- 作为事件处理程序的函数
- 一个布尔值。最后这个布尔值参数如果是 true,表示在捕获 阶段调用事件处理程序;如果是 false,表示在冒泡阶段调用事件处理程序。
var btn = document.getElementById("myBtn"); var handler = function(){ alert(this.id); }; btn.addEventListener("click", handler, false); //这里省略了其他代码 btn.removeEventListener("click", handler, false); //有效!
添加的事件处理程序是在其依附的元素的作用域 中运行
可以添加多个事件,按顺序先后触发。
第二个参数不可用匿名函数,不然两个方法指向不是同一个函数,传入 removeEventListener()中的事件处理程序函数必须与传入 addEventListener()中的相同
IE中的事件处理程序 attachEvent()和 detachEvent(),接收2个参数
- 事件处理程序名称
- 事件处理程序函数
在 IE 中使用 attachEvent()与使用 DOM0 级方法的主要区别在于事件处理程序的作用域。在使 用 DOM0 级方法的情况下,事件处理程序会在其所属元素的作用域内运行;在使用 attachEvent()方 法的情况下,事件处理程序会在全局作用域中运行,因此 this 等于 window。
var btn = document.getElementById("myBtn"); btn.attachEvent("onclick", function(){ alert(this === window); //true });
与 DOM 方法不同的是,这些事件处理程序不是以添加它们的顺序执行,而是以相反的顺序被触发,先输出Hello world!在输出clicked
var btn = document.getElementById("myBtn"); btn.attachEvent("onclick", function(){ alert("Clicked"); }); btn.attachEvent("onclick", function(){ alert("Hello world!"); });
DOM事件处理程序
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。