1. 程式人生 > >web開發中的各種瀏覽器的相容問題

web開發中的各種瀏覽器的相容問題

最近在學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 == "...") // 判斷事件觸發的目標,是不是相應的類名

});