更靠譜的js判斷瀏覽器及其版本

全部的前端開發人員都沒有辦法迴避一個問題，那就是瀏覽器版本判斷，當咱們沒法迴避須要進行瀏覽器版本判斷時，前輩們每每會告訴咱們，能夠判斷 UserAgent這個用來標示瀏覽器的字符串，經過判斷這一字符串的特徵來判斷瀏覽器版本。可是如今瀏覽器層出不窮，許多瀏覽器都內置更改 UserAgent的選項，或者專門的插件，使得UserAgent告訴咱們的信息愈來愈不許確。那麼什麼樣的方式判斷瀏覽器版本纔是比較靠譜的呢？查查 瀏覽器廠商提供的文檔，咱們不難發現，許多瀏覽器廠商其實爲咱們內置了專門的標示方法，或者有其很是獨特的DOM對象，利用這些，咱們就能精確的判斷瀏覽 器，甚至判斷出版本號呢。下面咱們開始演示。咱們從簡單的先開始。

1.presto內核（Opera）
opera瀏覽器中有個特有的window.opera對象，經過opera.version()能夠直接獲取版本號，這是官方內置方法。

目前對於webkit 內核的 opera 已經沒有這個內置標誌了

2.webkit內核（safari、chrome、maxthon3高速模式）
webkit內核的瀏覽器中window對象一下成員以「WebKitXxxxx」開頭，這是其有別於其餘瀏覽器內核的獨特特徵
        1)safari瀏覽器中，navigator.vendor的值爲「Apple Computer, Inc.」
        2)chrome中有兩個特有的對象window.google、window.chrome、window.chromium
        3)maxthon下window.external.mxVersion爲版本號

3.Gecko內核（Firefox）
繼承netscape瀏覽器衣鉢的Firefox至今依然保留留着window.netscape對象，且navigator.product的值爲「Gecko」

4.IE
IE的JScript獨有的條件註釋能夠方便的與其餘瀏覽器區別開來，document.documentMode能夠判斷IE8以上的版本號，I五、E六、7 可根據DOM對象差別來區別。


原理講完，下面寫一個DEMO，用上邊的方法重寫jQuery的$.browser.對象。

 

(function(win, $){

    var doc = win.document,
        nav = win.navigator,
        html = doc.documentElement;

//瀏覽器版本判斷
/*@cc_on @if (@_jscript)
    $.browser = {
        msie: true,
        version: doc.documentMode || (doc.compatMode == "CSS1Compat" ? "XMLHttpRequest" in win ? 7 : 6 : 5)
    };
    nav.language = nav.userLanguage;
@else @*/

    if ( win.opera ) {
        //opera
        $.browser = {
            opera: true,
            version: opera.version()
        };
        nav.language = nav.language.replace(/-[a-z]{2}$/, function(str ) {
            return str.toUpperCase();
        });//20150115 測試只對opera 瀏覽器不起做用，其餘的都ok
    } else {
        function browser(name){
            if( !$.browser[name] ) {
                $.browser = {version: true};
                $.browser[name] = true;
            }
        }
        if ( win.netscape && nav.product == "Gecko" ) {
            //firefox
            browser("mozilla");
        } else {
            //webkit
            browser("webkit");
            $.browser.chrome = !!win.chrome;
            $.browser.safari = /^apple\s+/i.test(nav.vendor);
        }
    }

/*@end @*/
})(this, jQuery);

 在加一句：console.log("v"==="\v")

//IE8如下的瀏覽器會返回true;IE9,chrome,firefox會返回false;由於IE8，7，6會把v和\v都編譯爲垂直製表符。

自測：目前只有opera 判斷不了，由於如今加入了 webkit 內核的 opera 已經再也不具備 window.opera 了，但願你們找到更好的解決判斷瀏覽器類型的辦法！
【來自：http://www.w3cfuns.com/article-2440-1-1.html】