首页 >web前端 >js教程 >如何使用 JavaScript 可靠地检测浏览器和版本?

如何使用 JavaScript 可靠地检测浏览器和版本?

Barbara Streisand
Barbara Streisand原创
2024-12-04 17:00:15788浏览

How Can I Reliably Detect Browser and Version Using JavaScript?

重新审视 JavaScript 中的浏览器检测

使用 JavaScript 确定确切的浏览器和版本可以成为定制 Web 体验的宝贵工具。以下是实现此目的的方法:

Navigator API:

JavaScript 中的 navigator 属性提供对浏览器信息的访问。它的 userAgent 属性包含一个标识浏览器及其版本的字符串。

使用正则表达式:

要从 userAgent 字符串中提取浏览器名称和版本,您可以使用正则表达式。以下示例代码使用全面的正则表达式来检测各种浏览器及其版本:

navigator.saysWho = (() => {
  const { userAgent } = navigator;
  let match = userAgent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
  let temp;

  // Handle special cases
  if (/trident/i.test(match[1])) {
    temp = /\brv[ :]+(\d+)/g.exec(userAgent) || [];
    return `IE ${temp[1] || ''}`;
  }

  if (match[1] === 'Chrome') {
    temp = userAgent.match(/\b(OPR|Edge)\/(\d+)/);
    if (temp !== null) {
      return temp.slice(1).join(' ').replace('OPR', 'Opera');
    }

    temp = userAgent.match(/\b(Edg)\/(\d+)/);
    if (temp !== null) {
      return temp.slice(1).join(' ').replace('Edg', 'Edge (Chromium)');
    }
  }

  // Construct the browser information string
  match = match[2] ? [match[1], match[2]] : [navigator.appName, navigator.appVersion, '-?'];
  temp = userAgent.match(/version\/(\d+)/i);
  if (temp !== null) {
    match.splice(1, 1, temp[1]);
  }

  return match.join(' ');
})();

console.log(navigator.saysWho); // outputs: `Chrome 89`

此脚本将用户代理字符串与各种浏览器模式进行匹配,并以字符串形式返回提取的浏览器和版本。

以上是如何使用 JavaScript 可靠地检测浏览器和版本?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn