快捷導(dǎo)航

使用js檢測(cè)瀏覽器的實(shí)現(xiàn)代碼

更新時(shí)間：2013年05月14日 16:06:40 作者：

本篇文章是對(duì)使用js檢測(cè)瀏覽器的實(shí)現(xiàn)代碼進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下

在寫跨瀏覽器的js程序中，檢測(cè)瀏覽器是一個(gè)很重要的工作。我們不時(shí)要為不同的瀏覽器寫分支代碼。
如下是一種：

//添加事件工具函數(shù)
function addEvent(el,type,handle){
    if(el.addEventListener){//for standard browses
        el.addEventListener(type,handle,false);
    }else if(el.attachEvent){//for IE
        el.attachEvent("on"+event,handle);
    }else{//other
        el["on"+type]=handle;
    }

}

1，第一種檢測(cè)瀏覽器方式稱為 user-agent 檢測(cè)方式。是最古老的，它檢測(cè)目標(biāo)瀏覽器的確切型號(hào)，包括瀏覽器的名稱和版本。其實(shí)就是一個(gè)字符串，用navigator.userAgen或navigator.appName獲取。如下：

復(fù)制代碼代碼如下:

function isIE(){
    return navigator.appName.indexOf("Microsoft Internet Explorer")!=-1 && document.all;
}
function isIE6() {
    return navigator.userAgent.split(";")[1].toLowerCase().indexOf("msie 6.0")=="-1"?false:true;
}
function isIE7(){
    return navigator.userAgent.split(";")[1].toLowerCase().indexOf("msie 7.0")=="-1"?false:true;
}
function isIE8(){
    return navigator.userAgent.split(";")[1].toLowerCase().indexOf("msie 8.0")=="-1"?false:true;
}
function isNN(){
    return navigator.userAgent.indexOf("Netscape")!=-1;
}
function isOpera(){
    return navigator.appName.indexOf("Opera")!=-1;
}
function isFF(){
    return navigator.userAgent.indexOf("Firefox")!=-1;
}
function isChrome(){
    return navigator.userAgent.indexOf("Chrome") > -1;  
}

2，第二種稱為對(duì)象/特征檢測(cè)方式，這是一種判斷瀏覽器能力的方式，也是目前流行的方式。即在使用一個(gè)對(duì)象之前檢測(cè)它是否存在。上面提到的addEvent方法中就使用了該方式。.addEventListener是w3c dom標(biāo)準(zhǔn)方式，而IE使用自己特有attachEvent。以下列舉幾個(gè)：

a，talbe.cells只有IE/Opera支持。

b，innerText/insertAdjacentHTML除Firefox外，IE6/7/8/Safari/Chrome/Opera都支持。

c，window.external.AddFavorite用來(lái)在IE下添加到收藏夾。

d，window.sidebar.addPanel用來(lái)在FF下添加到收藏夾。

3，第三種很有趣，暫且稱為瀏覽器缺陷或bug 方式，即某些表現(xiàn)不是瀏覽器廠商刻意實(shí)現(xiàn)的。如下：

復(fù)制代碼代碼如下:

var isIE = !+"\v1";
var isIE = !-[1,];
var isIE = "\v"=="v";
isSafari=/a/.__proto__=='//';
isOpera=!!window.opera;

最經(jīng)典的莫過(guò)于 !-[1,] 的判斷方式，目前最少代碼判斷IE的方式，只需6個(gè)byte。這是個(gè)俄國(guó)人發(fā)現(xiàn)的。利用了數(shù)組[1,]的length。還有來(lái)自英國(guó)的年輕 James Padolsey 利用IE條件注釋

復(fù)制代碼代碼如下:

var ie = (function(){
    var undef,
        v = 3,
        div = document.createElement('div'),
        all = div.getElementsByTagName('i');

    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
        all[0]
    ); 
    return v > 4 ? v : undef
}());

被稱為史上最有創(chuàng)意的IE判斷。

注1：isIE = "\v" == "v" 方式IE9已經(jīng)修復(fù)該bug，不能用此方式判斷IE瀏覽器了(2010-6-29用IE9 pre3測(cè)試的)

您可能感興趣的文章: