CSS瀏覽器相容性寫法、JS瀏覽器相容性寫法
阿新 • • 發佈:2018-12-11
一、瀏覽器的核心
IE:trident核心
Firefox(火狐):gecko核心
Chrome:Blink(基於Webkit)
Safari:Webkit核心
Oprea:現用Blink,以前是presto核心
二、CSS瀏覽器相容性
-moz- 火狐
-o- opera早期
-webkit- 谷歌、safari
-ms- IE
三、JS瀏覽器相容的寫法
瀏覽器相容問題有很多,包括個瀏覽器元素查詢問題、DOM操作以及事件。下面列舉幾種常見JS事件的相容性寫法。
1、js阻止預設事件
var e = event ? || window.event; 簡寫形式: var e=e || window.event;
//如果存在event,那麼var e=event;如果不存在event,那麼var e=window.event,為了實現多種瀏覽器相容
//js阻止預設事件
document.onclick = function(e){
var e = event ? || window.event;
if(e.preventDefault){
e.preventDefault(); //W3C標準
} else {
e.returnValue = fasle; //IE
}
}
2、阻止事件冒泡事件
//阻止冒泡事件 document.onclik = function(e){ var e = e || window.event; if(e.stopPropagation){ e.stopPropagation(); //W3C } else { e.cancelBlue = true; } }
3、獲取事件及事件物件目標
getEvent:function(e){
return e || window.event;
};
getTarget:function(e){
return e.target || event.srcElement;
};
4、新增事件方法
addHandler:function(element,type,handler){ if(element.addEventListener){ //檢測是否為DOM2級方法 element.addEventListener(type, handler, false); }else if (element.attachEvent){ //檢測是否為IE級方法 element.attachEvent("on" + type, handler); } else { //檢測是否為DOM0級方法 element["on" + type] = handler; }; };