最全最精準的IE瀏覽器判斷和國內套殼瀏覽器判斷(360,QQ,搜狗,百度等)

僅針對IE瀏覽器和國內主流套殼瀏覽器進行判斷,不對其他瀏覽器進行判斷
IE判斷說明:判斷瀏覽器的目的在於根據不同的瀏覽器作出不同的後臺響應,而最主要針對的無非是CSS樣式代碼,而IE瀏覽器坑很多,它同時具備文檔模式和瀏覽器模式(用戶代理字符串),IE瀏覽器的文檔模式不同則其對應的渲染引擎不同,CSS樣式的顯示應該以渲染引擎爲參考標準,而不是單純以用戶代理字符串爲標準。

function browerType() {
    var browerName = '其他瀏覽器';
    var ua = navigator.userAgent.toLocaleLowerCase();
    // 判斷是否爲IE(第一個是正常的IE,第二個是Edge,第三個是IE11)
    var isIE = (ua.indexOf("compatible") > -1 && ua.indexOf("msie") > -1) || (ua.indexOf("edge") > -1) || (ua.indexOf('trident') > -1 && ua.indexOf("rv:11.0") > -1);
    // 判斷是否爲IE5678,!+[1,] 在IE5678返回true,在IE9、IE10、IE11返回false
    var isLteIE8 = isIE && !+[1,];
    // 用於防止因通過IE8+的文檔兼容性模式設置文檔模式,導致版本判斷失效
    var dm = document.documentMode, 
                isIE5, 
                isIE6, 
                isIE7, 
                isIE8, 
                isIE9, 
                isIE10, 
                isIE11;
    if (dm) {
        isIE5 = dm === 5;
        isIE6 = dm === 6;
        isIE7 = dm === 7;
        isIE8 = dm === 8;
        isIE9 = dm === 9;
        isIE10 = dm === 10;
        isIE11 = dm === 11;
    } else {
        // 判斷是否爲IE5,IE5的文本模式爲怪異模式(quirks),真實的IE5.5瀏覽器中沒有document.compatMode屬性  
        isIE5 = (isLteIE8 && (!document.compatMode || document.compatMode === 'BackCompat'));

        // 判斷是否爲IE6,IE7開始有XMLHttpRequest對象  
        isIE6 = isLteIE8 && !isIE5 && !XMLHttpRequest;

        // 判斷是否爲IE7,IE8開始有document.documentMode屬性  
        isIE7 = isLteIE8 && !isIE6 && !document.documentMode;

        // 判斷是否IE8  
        isIE8 = isLteIE8 && document.documentMode;

        // 判斷IE9,IE9嚴格模式中函數內部this不爲undefined  
        isIE9 = !isLteIE8 && (function () {
            "use strict";
            return !!this;
        }());

        // 判斷IE10,IE10開始支持嚴格模式,嚴格模式中函數內部this爲undefined   
        isIE10 = isIE && !!document.attachEvent && (function () {
            "use strict";
            return !this;
        }());

        // 判斷IE11,IE11開始移除了attachEvent屬性  
        isIE11 = isIE && !document.attachEvent;
    };
    // IE瀏覽器的判斷
    browerName = isIE5 ? 'IE5' : 
                 isIE6 ? 'IE6' : 
                 isIE7 ? 'IE7' : 
                 isIE8 ? 'IE8' : 
                 isIE9 ? 'IE9' : 
                 isIE10 ? 'IE10' : 
                 isIE11 ? 'IE11' : 
                 // 國內套殼瀏覽器判斷
                 (ua.indexOf('qqbrowser') > -1) ? 'QQ瀏覽器' :
                 // 先判斷QQ瀏覽器再判斷搜狗瀏覽器,因爲QQ瀏覽器也有'se'
                 (ua.indexOf('se') > -1) ? '搜狗瀏覽器' :
                 (ua.indexOf('aoyou') > -1) ? '遨遊瀏覽器' :
                 (ua.indexOf('theworld') > -1) ? '世界之窗瀏覽器' :
                 (ua.indexOf('worldchrome') > -1) ? '世界之窗極速瀏覽器' :
                 (ua.indexOf('greenbrowser') > -1) ? '綠色瀏覽器' :
                 (ua.indexOf('baidu') > -1) ? '百度瀏覽器' :            
                 // 360瀏覽器判斷的特殊方法,打開新頁原來的'360'字符串代理已經不顯示,方法失效,同時也要晚於搜狗瀏覽器判斷,不然搜狗會被認爲360瀏覽器
                 (window.navigator.mimeTypes[40] || !window.navigator.mimeTypes.length) ? '360瀏覽器' : '其他瀏覽器';
    console.log(browerName);
}

注:針對IE瀏覽器的文檔模式和瀏覽器模式,這裏作出一定的區別解釋。

  1. 瀏覽器模式
    “瀏覽器模式”用於切換IE針對該網頁的默認文檔模式、對不同版本瀏覽器的條件備註解析、發送給網站服務器的用戶代理(User-Agent)字符串的值。網站可以根據瀏覽器返回的不同用戶代理字符串判斷瀏覽器的版本和安裝的功能,這樣就可以向不同的瀏覽器返回不同的頁面內容。 默認情況下,IE8的瀏覽器模式爲IE8。用戶可以通過單擊地址欄旁邊的兼容性視圖按鈕來手動切換到不同的瀏覽器模式。在IE8中,IE8兼容性視圖會以IE7文檔模式來顯示網頁,同時會向服務器發送IE7的用戶代理字符串。
  2. 文檔模式
    “文檔模式”用於指定IE的頁面排版引擎(Trident)以哪個版本的方式來解析並渲染網頁代碼。切換文檔模式會導致網頁被刷新,但不會更改用戶代理字符串中的版本號,也不會從服務器重新下載網頁。切換瀏覽器模式的同時,瀏覽器也會自動切換到相應的文檔模式。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章