反应检查是移动还是桌面 - JavaScript

对于前端开发人员而言，如何判断用户正在使用的是移动端还是台式机电脑，是非常重要的。这可以让我们决定应该如何为用户呈现网站或应用程序。

以下是一些 JavaScript 方法，可用于检查用户设备类型。

1. 通过屏幕宽度检查

你可以检查用户的屏幕宽度来确定他们是否在移动设备上。通常，移动设备的屏幕宽度小于台式机电脑。因此，如果屏幕宽度小于某个特定值，则可以认为用户是在移动设备上。

if(screen.width < 768) {
  console.log("用户正在使用移动设备");
} else {
  console.log("用户正在使用台式机电脑");
}

2. 通过用户代理检查

用户代理是一个字符串，用于描述用户的浏览器信息。检查用户代理可以帮助我们确定用户正在使用的设备类型。

以下是一些常见的用户代理字符串：

• iPhone: Mozilla/5.0 (iPhone; CPU iPhone OS 14_0_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0 Mobile/15E148 Safari/604.1
• iPad: Mozilla/5.0 (iPad; CPU OS 14_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0 Mobile/15E148 Safari/604.1
• Android: Mozilla/5.0 (Linux; Android 11; M2102J20SG) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.120 Mobile Safari/537.36

你可以使用以下代码获取用户代理字符串：

var userAgent = navigator.userAgent;
console.log(userAgent);

3. 通过触摸事件检查

另一种检查设备类型的方法是检查设备是否支持触摸事件。移动设备通常支持触摸事件，而台式机电脑则不支持。

var isTouchDevice = 'ontouchstart' in document.documentElement;

if(isTouchDevice) {
  console.log("用户正在使用移动设备");
} else {
  console.log("用户正在使用台式机电脑");
}

以上是一些用于检查用户设备类型的 JavaScript 方法。根据具体需求和场景，你可以选择其中任何一种。