如何在JavaScript中检测浏览器渲染引擎?

| 我读了一本书,名为《面向Web开发人员的专业Javascript第二版》,书中指出该代码可以检测浏览器渲染引擎:
    <script type=\"text/javascript\">
  var client = function(){
     var engine = {
        ie: 0,
        gecko: 0,
        webkit: 0,
        khtml: 0,
        opera: 0,

        ver: null
     };

     return {
        engine : engine  
     };

  }();

  if(client.engine.ie){
      alert(\"This is internet explorer\");
  }else if(client.engine.gecko > 1.5){
      if(client.engine.ver == \"1.8.1\"){
          alert(\"This is gecko rendering browser\");
      }
  }else if(client.engine.webkit){
        alert(\"This is web kit\");
  }else if(client.engine.khtml){
       alert(\"This is khtml\");
  }else{
       alert(\"none of the above\");
  }
</script>
但似乎不起作用,因此这段代码如何检测浏览器呈现引擎?谢谢     
已邀请:
        如果您阅读了本章的其余部分并下载了源代码 然后您可以查看client.js: 它仍然可以在Win7的IE10和Win10的Chrome 67中使用 需要稍作更改才能处理IE11(Trident /)和Edge(Edge /)-稍后再见
var client = function() {

  //rendering engines
  var engine = {
    ie: 0,
    gecko: 0,
    webkit: 0,
    khtml: 0,
    opera: 0,

    //complete version
    ver: null
  };

  //browsers
  var browser = {

    //browsers
    ie: 0,
    firefox: 0,
    safari: 0,
    konq: 0,
    opera: 0,
    chrome: 0,
    safari: 0,

    //specific version
    ver: null
  };


  //platform/device/OS
  var system = {
    win: false,
    mac: false,
    x11: false,

    //mobile devices
    iphone: false,
    ipod: false,
    nokiaN: false,
    winMobile: false,
    macMobile: false,

    //game systems
    wii: false,
    ps: false
  };

  //detect rendering engines/browsers
  var ua = navigator.userAgent;
  if (window.opera) {
    engine.ver = browser.ver = window.opera.version();
    engine.opera = browser.opera = parseFloat(engine.ver);
  } else if (/AppleWebKit\\/(\\S+)/.test(ua)) {
    engine.ver = RegExp[\"$1\"];
    engine.webkit = parseFloat(engine.ver);

    //figure out if it\'s Chrome or Safari
    if (/Chrome\\/(\\S+)/.test(ua)) {
      browser.ver = RegExp[\"$1\"];
      browser.chrome = parseFloat(browser.ver);
    } else if (/Version\\/(\\S+)/.test(ua)) {
      browser.ver = RegExp[\"$1\"];
      browser.safari = parseFloat(browser.ver);
    } else {
      //approximate version
      var safariVersion = 1;
      if (engine.webkit < 100) {
        safariVersion = 1;
      } else if (engine.webkit < 312) {
        safariVersion = 1.2;
      } else if (engine.webkit < 412) {
        safariVersion = 1.3;
      } else {
        safariVersion = 2;
      }

      browser.safari = browser.ver = safariVersion;
    }
  } else if (/KHTML\\/(\\S+)/.test(ua) || /Konqueror\\/([^;]+)/.test(ua)) {
    engine.ver = browser.ver = RegExp[\"$1\"];
    engine.khtml = browser.konq = parseFloat(engine.ver);
  } else if (/rv:([^\\)]+)\\) Gecko\\/\\d{8}/.test(ua)) {
    engine.ver = RegExp[\"$1\"];
    engine.gecko = parseFloat(engine.ver);

    //determine if it\'s Firefox
    if (/Firefox\\/(\\S+)/.test(ua)) {
      browser.ver = RegExp[\"$1\"];
      browser.firefox = parseFloat(browser.ver);
    }
  } else if (/MSIE ([^;]+)/.test(ua)) { // add Trident/ to test IE11, Edge for Edge
    engine.ver = browser.ver = RegExp[\"$1\"];
    engine.ie = browser.ie = parseFloat(engine.ver);
  }

  //detect browsers
  browser.ie = engine.ie;
  browser.opera = engine.opera;


  //detect platform
  var p = navigator.platform;
  system.win = p.indexOf(\"Win\") == 0;
  system.mac = p.indexOf(\"Mac\") == 0;
  system.x11 = (p == \"X11\") || (p.indexOf(\"Linux\") == 0);

  //detect windows operating systems
  if (system.win) {
    if (/Win(?:dows )?([^do]{2})\\s?(\\d+\\.\\d+)?/.test(ua)) {
      if (RegExp[\"$1\"] == \"NT\") {
        switch (RegExp[\"$2\"]) {
          case \"5.0\":
            system.win = \"2000\";
            break;
          case \"5.1\":
            system.win = \"XP\";
            break;
          case \"6.0\":
            system.win = \"Vista\";
            break;
          default:
            system.win = \"NT\";
            break;
        }
      } else if (RegExp[\"$1\"] == \"9x\") {
        system.win = \"ME\";
      } else {
        system.win = RegExp[\"$1\"];
      }
    }
  }

  //mobile devices
  system.iphone = ua.indexOf(\"iPhone\") > -1;
  system.ipod = ua.indexOf(\"iPod\") > -1;
  system.nokiaN = ua.indexOf(\"NokiaN\") > -1;
  system.winMobile = (system.win == \"CE\");
  system.macMobile = (system.iphone || system.ipod);

  //gaming systems
  system.wii = ua.indexOf(\"Wii\") > -1;
  system.ps = /playstation/i.test(ua);

  //return it
  return {
    engine: engine,
    browser: browser,
    system: system
  };

}();

console.log(client.browser,client.engine,client.system)
        该脚本显然不起作用-只是将一堆变量设置为零或null,然后检查它们是否为零或null。我的猜测是这不是全部脚本,并且关键部分丢失了。 通常,人们会做的是读取UserAgent字符串(我太懒了,以至于google却无法精确地做到这一点)并向其抛出一些正则表达式以检测已知模式。这种用户代理嗅探有很多缺点: 不向前兼容。您不知道未来的浏览器将使用哪种UA字符串,因此,即使更新的浏览器可以轻松处理全眼的糖果打击,但很可能新的浏览器将无法通过测试并获得精简的版本。你介意的 UA字符串不可靠。正因为如此多的网站犯了嗅探错误,然后没有定期进行更新,用户设置了不同的UA字符串,目的是报告“错误的”渲染引擎。然后他们忘记将其切换回原位,从而导致各种奇怪的行为。 仅仅因为某人拥有某个渲染引擎并不意味着您可以依赖那里的所有功能。浏览器是高度可配置的,人们使用各种扩展程序,有选择地或完全地阻止了一切。 长话短说,而不是嗅探UA字符串并假设事情就是您认为的样子,而是单独并直接测试功能。     
        这只是一种选择。如果您真的担心渲染问题,就设计而言,您总是可以选择屏幕宽度。 对于单页应用程序,您只需要根据屏幕宽度和您的要求将屏幕显示为正确的尺寸... :) 我们利用了:
if(screen.width > 360 && screen.width < 720){
    document.write (\'<meta name=\"viewport\" content=\"initial-scale=.25, maximum-scale=.25, user-scalable=no\">\');
 }
对于ios,iphone,ipad来说,这非常容易,因为您只能使用固定尺寸或标准尺寸进行播放。 对于Android来说,确实让您感到沮丧,我们发现前进的是ldpi,mdpi,hdpi,xhdi和max xxhdpi(对于制表符)像素范围。     

要回复问题请先登录注册