• 更靠谱的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以上的版本号,I5、E6、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 = /^apples+/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】

  • 相关阅读:
    Windows Phone 7.8 SDK 离线安装包
    利用Async CTP改造Live SDK for WP7
    删除TFS云端上的项目
    Azure通过TFS进行部署
    IIS部署 HTTP Error 500.35 ANCM Multiple InProcess Applications in same Process
    树莓派4B装机指南(无屏幕)
    腾讯云VPS(CVM)重装Debian系统后的基础配置工作
    @Schedule和基于SchedulingConfigurer 定时任务
    (FutureTask和Future) 使用方式 开启线程异步执行并可以阻塞得到返回值
    springboot与logbackspring 非常简单集成
  • 原文地址:https://www.cnblogs.com/lechenging/p/4226494.html
Copyright © 2020-2023  润新知