JS 兼容整理
获取非行内样式的兼容方式
function getStyle(obj,attr){//获取非行间样式，obj是对象，attr是值if(obj.currentStyle){//针对ie获取非行间样式return obj.currentStyle[attr];
}else{
returngetComputedStyle(obj,false)[attr];//针对非ie }
}
获取事件对象的兼容方式
document.onclick=function(eve){
vare=eve||window.event;
console.log(e);
}
事件冒泡的兼容方法
function stopBubble(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble =true;//兼容ie }
}
阻止浏览器默认行为的兼容方法
if( e.preventDefault ){
e.preventDefault();
}else{
window.event.returnValue =false;//ie}
监听事件的设置和移除的兼容方式
1.封装成对象的方式
varEventUtil={
addHandler:function(DOM,EventType,fn){
if(DOM.addEventListener){
DOM.addEventListener(EventType,fn,false);
}elseif(DOM.attachEvent){
DOM.attachEvent('on'+EventType,fn)
}else{
DOM['on'+EventType]=fn
}
},
removeHandler:function(DOM,EventType,fn){
if(DOM.removeEventListener){
DOM.removeEventListener(EventType,fn,false)
}elseif(DOM.detachEvent){
DOM.detachEvent('on'+EventType,fn)
}else{
DOM['on'+EventType]=null;
}
}
}2.封装成两个函数的方式
function addEvent(obj,inci,back){
if(obj.addEventListener){
obj.addEventListener(inci,back);
}elseif(obj.attachEvent){
obj.attachEvent("on"+ inci,back);
}else{
obj["on"+inci] = back;
}
}
function removeEvent(obj,inci,back){
if(obj.removeEventListener){
obj.removeEventListener(inci,back,false);
}elseif(obj.detachEvent){
obj.detachEvent("on"+ inci,back);
}else{
obj["on"+inci] =null;
}
}
事件委托的兼容方法
varoul = document.querySelector("ul")
oul.onclick = function(eve){
vare = eve || window.event;
vart = e.target || e.srcElement;
if(t.getAttribute("abc") =="l"){
console.log(e.target.innerHTML)
}
}
键盘事件的兼容方法
vareve = eve||window.event;varkeyC = eve.keyCode||eve.which;
