美文网首页JavaScript < ES5、ES6、ES7、… >
JavaScript 高级程序设计(第9章 客户端检测)

JavaScript 高级程序设计(第9章 客户端检测)

作者: yinxmm | 来源:发表于2018-08-10 18:13 被阅读10次

    第9章 客户端检测

    1. 能力检测

    能力检测的基本模式:

    if (object.propertyInQuestion){ 
    //使用 object.propertyInQuestion
    }
    

    (1) 更可靠的能力检测

    function isSortable(object){
            return typeof object.sort == "function";
    }
    

    (2) 能力检测,不是浏览器检测
    * 检测某个或某几个特性并不能够确定浏览器。

    //错误!还不够具体
    var isFirefox = !!(navigator.vendor && navigator.vendorSub);
    //错误!假设过头了
    var isIE = !!(document.all && document.uniqueID);
    

    * 根据浏览器不同将能力组合起来是更可取的方式。

    //确定浏览器是否支持 Netscape 风格的插件
    var hasNSPlugins = !!(navigator.plugins &&
     navigator.plugins.length);
    //确定浏览器是否具有 DOM1 级规定的能力
    var hasDOM1 = !!(document.getElementById &&
     document.createElement && document.getElementsByTagName);
    

    2. 怪癖检测

    怪癖检测(quirks detection)的目标是识别浏览器的特殊行为。

    IE8 及更早版本中存在一个 bug,即如果 某个实例属性与[[Enumerable]]标记为 false 的某个原型属性同名,那么该实例属性将不会出现在 fon-in 循环当中。

    3. 用户代理检测

    用户代理检测通过检测用户代理字符串来确定实际使用的浏览器。
    (1) 用户代理字符串的历史
    (2) 用户代理字符串检测技术
    * 识别呈现引擎
    主要检测五大呈现引擎:IE、Gecko、WebKit、KHTML 和 Opera。
    检测脚本的基本代码结构:

    var client = function(){
        var engine = {
        //呈现引擎 
            ie: 0,
            gecko: 0,
            webkit: 0,
            khtml: 0,
            opera: 0,
            //具体的版本号
            ver: null 
         };
        //在此检测呈现引擎、平台和设备
        return {
            engine : engine
        };
     }();
    
    
    if (client.engine.ie) { //如果是IE,client.ie的值应该大于0 
        //针对 IE 的代码
    } else if (client.engine.gecko > 1.5){
        if (client.engine.ver == "1.8.1"){
            //针对这个版本执行某些操作 
        }
    }
    

    检测顺序:

    1. 第一步就是识别Opera,因为它的用户代理字符串有可能完全模仿其他浏览器。
    2. 第二位检测的呈现引擎是 WebKit。因为 WebKit 的用户代理字符串中包含"Gecko"和 "KHTML"这两个子字符串,所以如果首先检测它们,很可能会得出错误的结论。不过,WebKit 的用户代理字符串中的"AppleWebKit"是独一无二的,因此检测这个字符串最合适。
    3. KHTML 的用户代理字符串中也包含"Gecko",因此 在排除 KHTML 之前,我们无法准确检测基于 Gecko 的浏览器。
    4. 在用户代理字符串中,Gecko的版本号不会出现在字符串“Gecko”的后面,而是会出现在字符串“rv”的后面。
      5.IE 的版本号位于字符串"MSIE"的后面、一个分号的前面。
    var ua = navigator.userAgent;
    if (window.opera){
        engine.ver = window.opera.version();
        engine.opera = parseFloat(engine.ver);
    } else if (/AppleWebKit\/(\S+)/.test(ua)){
        engine.ver = RegExp["$1"];
        engine.webkit = parseFloat(engine.ver);
    } else if (/KHTML\/(\S+)/.test(ua)) {
        engine.ver = RegExp["$1"];
        engine.khtml = parseFloat(engine.ver);
    } else if (/rv:([^\)]+)\) Gecko\/\d{8}/.test(ua)){
        engine.ver = RegExp["$1"];
        engine.gecko = parseFloat(engine.ver);
    }
    

    *识别浏览器
    * 识别平台
    * 识别 Windows 操作系统
    * 识别移动设备
    *识别游戏系统

    相关文章

      网友评论

        本文标题:JavaScript 高级程序设计(第9章 客户端检测)

        本文链接:https://www.haomeiwen.com/subject/epylbftx.html