最近在学js开发,发现很多浏览器兼容问题有不同的写法,记录一下.
1.css3中的新标签
比如border-radius,box-shadow
要写成多浏览器兼容
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
2.判断是不是IE浏览器
var isIE = navigator.userAgent.indexOf("MISE") > -1; //无法判断IE11
3.帮定事件的方法
传统方法:element.onclick = function(e){...}
w3c标准方法:element.addEventListener("click",function(event){...})
IE事件注册方法:element.attachEvent("onclick",function(){...})
所以可以统一为:
function addEvent(element, event, callbackFunction){
if(element.addEventListener){
element.addEventListener(event, callbackFunction,false);
}else if (element.attachEvent){
element.attachEvent('on'+event,callbackFunction);
}
}
4.跨浏览器获取事件的方法
addEvent(demo,"mouseover",function(e){
var event = e || window.event;//IE浏览器用window.event获取
var target = event.target || event.srcElement; //获取事件触发的目标
if (target.className == "...") // 判断事件触发的目标,是不是相应的类名
});