javascript中DOM事件绑定的内容分析

来源：动视网责编：小采时间：2020-11-27 19:31:20

javascript中DOM事件绑定的内容分析

javascript中DOM事件绑定的内容分析:本篇文章给大家带来的内容是关于javascript中DOM事件绑定的内容分析，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。DOM 2 级事件element.addEventListener(type,handler,boolean)第一个值代表事件类型，不加on。第二个是执行的方法

推荐度：

点击下载本文 文档为doc格式

导读javascript中DOM事件绑定的内容分析:本篇文章给大家带来的内容是关于javascript中DOM事件绑定的内容分析，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。DOM 2 级事件element.addEventListener(type,handler,boolean)第一个值代表事件类型，不加on。第二个是执行的方法

本篇文章给大家带来的内容是关于javascript中DOM事件绑定的内容分析，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

DOM 2 级事件

element.addEventListener(type,handler,boolean)
第一个值代表事件类型，不加on。
第二个是执行的方法。(事件处理函数)
第三个值是一个布尔值，默认为false，只在冒泡阶段执行。true为在捕获阶段执行

element.removeEventListener(type,handler,boolean)
第一个值代表事件类型，不加on。
第二个是执行的方法。(事件处理函数)
第三个值是一个布尔值，默认为false，只在冒泡阶段执行。true为在捕获阶段执行
移除事件。用法与addEventListener一致。

element.attachEvent(type,handler) IE的事件绑定。
element.detachEvent(type，handler) IE的事件移除。
第一个值代表事件类型，加on。
第二个是执行的方法。(事件处理函数),
由于IE的事件模型只有冒泡模型,所以,只用传两个值.

添加跨浏览器事件绑定

var addEvent = function(ele,type,handler){
 if(ele.addEventListener){
 ele.addEventListener(type,handler,false)
 }else if(ele.attachEvent){
 ele.attachEvent("on"+type,handler)
 }else{
 ele["on"+type]=handler
 }
}
addEvent(btn,"click",function(){console.log("点击")})

移除跨浏览器绑定

function removeEvent(ele,type,handler){
 if(ele.removeEventListener){
 ele.removeEventListener(type,handler,false)
 }
 else if(ele.detachEvent){
 ele.detachEvent('on'+type,handler)
 }
 else{
 ele['on'+type]=null
 }
}
removeEvent(btn,"click",function(){console.log("点击")})

DOM 0 级事件
HTML中的on-属性

<button id="btn" onclick="console.log(1)">确定</button>
<button id="btn" onclick="fn()">确定</button>

引号中字符的是可以执行的字符串
由于HTML中的on-方法使得js与HTML紧密的耦合在一起，不利于后期维护，所以不推荐使用。

DOM 0级事件

var btn=document.getElementById("btn")
btn.onclick=function(){
 console.log(1);
}
btn.onclick=function(){
 console.log(2);
}//2

如果添加相同的事件,后面的会覆盖前面的事件

javascript中DOM事件绑定的内容分析

推荐度：

点击下载本文 文档为doc格式

标签：绑定事件 js

热门焦点

javascript中DOM事件绑定的内容分析

javascript中DOM事件绑定的内容分析

DOM 0级事件

javascript中DOM事件绑定的内容分析

最新推荐

猜你喜欢

热门推荐