在网页开发中，有时我们需要根据用户访问设备的不同，提供适应性的界面或功能。"JS判断手机端与电脑访问"这个话题就是关于如何使用JavaScript来检测用户是通过移动设备（如智能手机或平板）还是桌面电脑（如笔记本或台式机）访问网站的。这通常涉及到设备的屏幕尺寸、触屏支持、浏览器特性等因素。
我们可以利用JavaScript的`navigator`对象，它包含了有关浏览器和用户的详细信息。`navigator.userAgent`属性返回一个字符串，包含了浏览器的类型、版本以及操作系统等信息。不同设备的浏览器在`userAgent`中的标识会有所不同，例如，iPhone的`userAgent`通常会包含"iPhone"或"WebKit"，而桌面浏览器则会有"Windows NT"或"Macintosh"等字样。
以下是一个简单的示例，基于`userAgent`字符串来判断设备类型：
```javascript
function isMobileDevice() {
return (typeof window.orientation !== "undefined") || (navigator.userAgent.indexOf('IEMobile') !== -1);
}
```
这段代码检查了两个条件：一是`window.orientation`属性是否存在，这个属性在移动设备上用于获取屏幕的方向；二是`userAgent`中是否包含"IEMobile"，这是IE浏览器在Windows Phone上的标识。
然而，仅依赖`userAgent`可能不够稳定，因为有些浏览器允许用户自定义`userAgent`字符串。更可靠的方法是结合多种特征进行判断，比如检查屏幕宽度、是否有触控能力等：
```javascript
function isMobileDevice() {
var isAndroid = /Android/i.test(navigator.userAgent);
var isiOS = /iPhone|iPad|iPod/i.test(navigator.userAgent);
var isTablet = screen.width > 768 && screen.height > 768;
if ((isAndroid || isiOS) && (screen.width <= 768 || screen.height <= 768)) {
return true; // 移动设备
} else if (isiOS && isTablet) {
return true; // iPad被视为移动设备
} else {
return false; // 桌面设备
}
}
```
在这个例子中，我们不仅检查了`userAgent`，还考虑了屏幕尺寸。如果设备的宽度和高度小于或等于768像素，通常被认为是手机；如果iOS设备且屏幕尺寸大于768像素，可能是一个iPad，也视为移动设备。
此外，还可以通过检测`window.innerWidth`和`window.innerHeight`来判断屏幕尺寸，或者利用`Modernizr`等库来检测浏览器对触控事件的支持，从而进一步确认设备类型。
在实际应用中，我们可能会根据设备类型来调整页面布局、禁用某些不适用于移动设备的功能，或者提供特定的移动优化功能，比如响应式设计、触摸事件处理等。
总结一下，JavaScript通过`navigator.userAgent`、屏幕尺寸、触控事件支持等方法可以有效地判断用户是使用移动设备还是桌面电脑访问网站。这在创建跨平台、适应性强的Web应用时非常重要，有助于提供更好的用户体验。
JS判断手机端与电脑访问.zip （1个子文件） 
JS判断手机端与电脑访问.js 291B
