【JavaScript 小工具】—— 判断用户是否通过手机端打开网页

Lily.C2024-06-29 21:28

在JavaScript中，判断用户是否通过手机端打开网页，通常可以通过检查窗口的宽度或使用用户代理(User Agent)字符串来实现。以下是一些常见的方法：

检查窗口大小 ：

使用window.innerWidth或window.outerWidth来获取屏幕的宽度，如果宽度小于某个特定值（例如，小于600像素），则可能意味着用户正在使用手机。
javascript 复制代码
```
if (window.innerWidth < 600) {
  // 可能是手机端
}
```
使用媒体查询 ：

媒体查询是CSS中的一种特性，可以在JavaScript中使用来检测设备类型。
javascript 复制代码
```
if (window.matchMedia("only screen and (max-width: 600px)").matches) {
  // 可能是手机端
}
```

检查User Agent ：

User Agent是一个字符串，包含了用户浏览器的类型、版本和操作系统等信息。可以通过检查这个字符串来判断用户是否在使用手机。

javascript 复制代码

var userAgent = navigator.userAgent;
if (userAgent.match(/Android/i) || userAgent.match(/webOS/i) ||
    userAgent.match(/iPhone/i) || userAgent.match(/iPad/i) ||
    userAgent.match(/iPod/i) || userAgent.match(/BlackBerry/i) ||
    userAgent.match(/Windows Phone/i)) {
  // 可能是手机端
}

请注意，由于一些现代浏览器会隐藏或修改User Agent字符串，这种方法可能不是100%准确。而且，随着设备和浏览器的不断更新，这些代码可能需要定期更新以适应新的设备和浏览器。