为了账号安全,请及时绑定邮箱和手机立即绑定

为什么要使用这样的方法?

这是老师的代码

//事件绑定方法
function bind(el, eventType, callback){
    if(typeof el.addEventListener === 'function'){
        //标准事件绑定方法
        el.addEventListener(eventType, callback, false);
    }else if(typeof el.attechEvent === 'function'){
        //IE事件绑定方法
        el.attachEvent('on' + eventType, callback);
    }
}
//鼠标悬停的处理函数
function mouseoverHandler(e){
    var target = e.target || e.srcElement;
    var outer = document.getElementById('subject');
    var list = outer.getElementsByTagName('li');
    //清空所有LI元素的class
    for(var i = 0; i < list.length; i++){
        list[i].className = '';
    }
    //根据事件的冒泡原理,找到需要变更class 的LI元素
    while(target.tagName != 'LI' || target.tagName == 'BODY'){
        target = target.parentNode;
    }
    target.className = 'big';
}

我的代码:

 for(var i =0; i < list.length; i++){
        list[i].onmouseenter=function(){
        	for(var i=0;i<list.length;i++){
        		list[i].className="";
        	}
        	this.className="big";
		}
}

疑问:为什么老师要使用事件监听的方法?

onmouseenter不是在这里更方便吗?

而且兼容各大浏览器包括IE5.5,并且不会发生冒泡事件。

谢谢回答!

正在回答

1 回答

addEventListener绑定的事件可以有多个,比如addEventListener(eventType, callback1, false);

addEventListener(eventType, callback2, false);

callback1,callback2都能执行,

如果直接绑定事件,比如onmouseenter,一开始时,该事件你只要执行callback1,后来业务拓展,需要在加个callback2方法,如果是直接绑定事件,后面的会覆盖前面的,看一下代码

list[i].onmouseenter=callback1();

list[i].onmouseenter=callback2();

是不是相当于onmouseenter这个事件被重新改写了,所以两者的差别在于是否易于扩展业务需求。

当然在这个课程中并没有突出哪种更合适,所以还是要看具体的项目需求,按需选择,望采纳,谢谢

1 回复 有任何疑惑可以回复我~
#1

飞天意大利面神兽 提问者

非常感谢!
2016-09-29 回复 有任何疑惑可以回复我~
#2

慕莱坞1975833 回复 飞天意大利面神兽 提问者

http://www.imooc.com/learn/74看这个课程会有更好的理解
2016-10-02 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么要使用这样的方法?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信