javascript 检测浏览器类型和版本的代码

2023年6月10日上午11:20 • JavaScript

要检测浏览器类型和版本，我们可以使用JavaScript中的navigator对象。该对象提供了关于浏览器的详细信息，包括应用程序名称、代码名称、浏览器版本、当前操作系统和语言等。

以下是使用JavaScript检测浏览器类型和版本的代码：

// 检测浏览器类型和版本的代码
const getBrowserInfo = () => {
  const ua = navigator.userAgent; // 获取用户代理
  let browser = {}; // 存储浏览器信息
  let tem; // 临时变量
  let match = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []; // 匹配浏览器信息

  if (/trident/i.test(match[1])){ // 判断是否为IE浏览器
    tem =  /\brv[ :]+(\d+)/g.exec(ua) || []; // 匹配IE浏览器版本
    return { browser: 'IE', version: (tem[1] || '') };
  }

  if (match[1] === 'Chrome'){ // 判断是否为Chrome浏览器
    tem = ua.match(/\bOPR\/(\d+)/); // 匹配Opera浏览器版本
    if (tem !== null) { // 判断是否为Opera浏览器
      return { browser: 'Opera', version: tem[1] };
    }
  }

  match = match[2] ? [match[1], match[2]] : [navigator.appName, navigator.appVersion, '-?'];

  if ((tem = ua.match(/version\/(\d+)/i)) != null){ // 匹配Safari和Opera浏览器版本
    match.splice(1, 1, tem[1]);
  }

  browser.name = match[0]; // 获取浏览器名称
  browser.version = match[1]; // 获取浏览器版本

  return browser;
}

// 调用浏览器检测函数
console.log(getBrowserInfo());

上述代码使用正则表达式匹配浏览器类型和版本。当匹配一个特定的用户代理时，代码将返回一个对象，其中包含浏览器名称和版本号。

下面是另一个检测浏览器类型和版本的示例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>检测浏览器类型和版本的示例</title>
  </head>
  <body>
    <h1>检测浏览器类型和版本的示例</h1>
    <script>
      var browser = { // 定义浏览器信息
        ie: false,
        firefox: false,
        chrome: false,
        opera: false
      };

      var ua = window.navigator.userAgent; // 获取用户代理

      if (/Trident/.test(ua)) { // 匹配IE浏览器
        browser.ie = ua.match(/rv:([\d.]+)/)[1];
      } else if (/Firefox/.test(ua)) { // 匹配Firefox浏览器
        browser.firefox = ua.match(/Firefox\/([\d.]+)/)[1];
      } else if (/Chrome/.test(ua)) { // 匹配Chrome浏览器
        browser.chrome = ua.match(/Chrome\/([\d.]+)/)[1];
      } else if (/Opera/.test(ua)) { // 匹配Opera浏览器
        browser.opera = ua.match(/Opera\/([\d.]+)/)[1];
      }

      console.log(browser); // 输出浏览器信息
    </script>
  </body>
</html>

上面的代码使用正则表达式匹配浏览器类型和版本，然后将结果存储在一个对象中，并在控制台中输出浏览器信息。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：javascript 检测浏览器类型和版本的代码 - Python技术站