正文

掌握JS技巧：轻松匹配操作系统及版本号全攻略

/0 浏览量
1102

在开发Web应用时，了解用户的操作系统及版本号对于优化用户体验和功能实现至关重要。JavaScript提供了多种方法来获取这些信息。以下是一份详细的攻略，帮助您轻松匹配操作系统及版本号。

获取操作系统信息

JavaScript中，可以通过navigator.userAgent属性来获取浏览器的用户代理字符串，这个字符串包含了操作系统的信息。以下是一些常见的获取操作系统信息的方法：

1. 简单判断操作系统

function getOS() {
  var userAgent = window.navigator.userAgent,
      platform = window.navigator.platform,
      macosPlatforms = ['Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'],
      windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'],
      iosPlatforms = ['iPhone', 'iPad', 'iPod'],
      os = null;

  if (macosPlatforms.indexOf(platform) !== -1) {
    os = 'Mac OS';
  } else if (iosPlatforms.indexOf(platform) !== -1) {
    os = 'iOS';
  } else if (windowsPlatforms.indexOf(platform) !== -1) {
    os = 'Windows';
  } else if (/Android/.test(userAgent)) {
    os = 'Android';
  } else if (!os && /Linux/.test(platform)) {
    os = 'Linux';
  }

  return os;
}

console.log(getOS());

2. 获取操作系统版本

function getOSVersion() {
  var userAgent = window.navigator.userAgent,
      osVersion = '';

  if (/Windows/.test(userAgent)) {
    osVersion = userAgent.match(/Windows NT (\d+\.\d+)/)[1];
  } else if (/Macintosh|MacIntel/.test(userAgent)) {
    osVersion = userAgent.match(/Mac OS X (\d+_\d+)/)[1].replace('_', '.');
  } else if (/iPhone|iPad|iPod/.test(userAgent)) {
    osVersion = userAgent.match(/OS (\d+)_?(\d+)/)[1] + '.' + userAgent.match(/OS (\d+)_?(\d+)/)[2];
  } else if (/Android/.test(userAgent)) {
    osVersion = userAgent.match(/Android (\d+\.\d+)/)[1];
  }

  return osVersion;
}

console.log(getOSVersion());

获取浏览器信息

获取操作系统信息的同时，我们也常常需要获取浏览器的信息。以下是一些常用的浏览器信息获取方法：

1. 获取浏览器名称

function getBrowserName() {
  var userAgent = window.navigator.userAgent,
      browser = '';

  if (/Edge/.test(userAgent)) {
    browser = 'Edge';
  } else if (/Chrome/.test(userAgent)) {
    browser = 'Chrome';
  } else if (/Firefox/.test(userAgent)) {
    browser = 'Firefox';
  } else if (/Safari/.test(userAgent)) {
    browser = 'Safari';
  } else if (/OPR/.test(userAgent)) {
    browser = 'Opera';
  }

  return browser;
}

console.log(getBrowserName());

2. 获取浏览器版本

function getBrowserVersion() {
  var userAgent = window.navigator.userAgent,
      browserVersion = '';

  if (/Edge/.test(userAgent)) {
    browserVersion = userAgent.match(/Edge\/(\d+)/)[1];
  } else if (/Chrome/.test(userAgent)) {
    browserVersion = userAgent.match(/Chrome\/(\d+)/)[1];
  } else if (/Firefox/.test(userAgent)) {
    browserVersion = userAgent.match(/Firefox\/(\d+)/)[1];
  } else if (/Safari/.test(userAgent)) {
    browserVersion = userAgent.match(/Version\/(\d+)/)[1];
  } else if (/OPR/.test(userAgent)) {
    browserVersion = userAgent.match(/OPR\/(\d+)/)[1];
  }

  return browserVersion;
}

console.log(getBrowserVersion());

总结

通过以上方法，您可以在JavaScript中轻松获取操作系统及版本号、浏览器信息。这些信息对于优化Web应用的功能和用户体验具有重要意义。希望这份攻略能帮助到您！

-- 展开阅读全文 --