JavaScript浏览器兼容解决及事件封装-笔记

JavaScript

封装事件的写法
var TFevent={
event1:function(参数1,参数2,参数3){
//这个事件用这三个参数干什么
}, //注意每个事件用逗号隔开
event2:function(参数1,参数2,参数3){
//这个事件用这三个参数干什么
}
}
引用我们封装的事件：
TFevent.event1(a,b,c);

DOM的三个处理程序级别以及IE程序处理方法

DOM 0级处理程序
XXX.onclick='true'; //添加点击事件

DOM 2级别处理程序
target 获取事件目标 例：alert(XXX.target);将会弹出事件目标
type 获取事件类型
event.stopPropagation(xx); //阻止事件冒泡
event.PreventDefault(); //阻止默认行为 如阻止a标签的跳转行为

IE的事件处理程序
srcElement; //即IE下的target
event.cancleBubble=true/false; //即IE下的阻止冒泡
event.returnValue=true/false; //即IE下的阻止默认行为

对于浏览器兼容问题，可以用封装事件的方法，用if语句判断不同浏览器后写不同的处理程序。

而在封装方法中 可以直接用相关语句进行检测是否有执行此方法的能力进而判断是否用这个处理程序，如:
var TFevent={
e:function(a,b,b){
if(a.addEventListener){
//如果有addEventListener的能力 就使用这个处理程序
a.addEventListener(xx,xx,xx);
}
else if(a.attachEvent){
//同上
a.attachEvent(xx,xx,xx);
}
else{ //上面的事件处理程序均无法使用 使用DOM0级处理程序
//使用DOM 0级处理程序
a.事件类型="XXX";
}

}

}

另外 在写的时候还有其他方法 比如要获取一个 事件目标
obj = event.srcElement ? event.srcElement//IE中: event.target//DOM二级中;
也可以这样写
var ele = event.target || event.srcElement；

小Tips
style中的display='block'/'none'; //显示或隐藏

此日志作为笔记仅仅作为记录与分享，转载请附版权-我叫掏粪
2016.9.29