欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JavaScript中多种绑定事件方式的区别讲解

程序员文章站 2023-12-31 12:54:22
1.匿名函数方式 缺点:无法多个事件实用一个函数。例如:我把鼠标点击时采用如下方式绑定,那么当鼠标滑入时,我也想做同样的事情,还想用处理逻辑1,那么只能再写一遍,因为函数匿名了,无法调用。 va...

1.匿名函数方式

缺点:无法多个事件实用一个函数。例如:我把鼠标点击时采用如下方式绑定,那么当鼠标滑入时,我也想做同样的事情,还想用处理逻辑1,那么只能再写一遍,因为函数匿名了,无法调用。

var  bn=document.getelementsbytagname("button")[0];
//绑定事件
bn.onclick=function (e) { 
 //处里逻辑1
   };
bn.onclick=null; //删除事件

2.attachevent方式添加

缺点:这是早期ie写法,没有冒泡机制。

var  bn=document.getelementsbytagname("button")[0];
bn.attachevent("onclick",clickhandler);
function clickhandler(e) {
	//处理逻辑
    }

3.addeventlistener方式添加

优点:具有冒泡机制

var p=document.getelementbyid("p");
p.addeventlistener("click",clickhandler);
function clickhandler(e) {
    //处理逻辑
}

上一篇:

下一篇: