Javascript 通过屏幕分辨率检测移动设备的可靠性如何？

这听起来有点太好了，不可能是真的，所以请告诉我是否是真的

如果我只有一个单一版本的移动网站（没有变化的 不同的设备，所有手机只有一个网站），它有多可靠 通过屏幕分辨率检测移动设备

如果屏幕分辨率小于400px，只需提供移动版即可

注意：我的问题假设启用了javascript。还有，我知道有

---

用户代理检测，但我不想使用它。

为那些确实在移动设备上运行支持JavaScript的web浏览器的用户将此功能添加到您的网站可能不会有什么坏处。对于那些不是这样的人，除了让他们在第一次加载时选择屏幕大小这样简单的事情之外，你几乎无能为力？可能是一个简单的下拉列表，其中包含可能的大小？

您将希望通过媒体查询来查看不同的样式表。您可以使用查询来标识屏幕宽度，并且仅为特定设备提供特定css。例如，此查询将仅为标识为具有iphone典型尺寸的设备提供iphone.css：

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" rel="stylesheet" />

有一篇关于这个问题的详细文章在

---

请记住，并非所有设备都能识别媒体查询。如果你需要支持很多旧设备，比如黑莓手机和翻盖手机，你应该接受上面关于使用UA检测的建议——我知道如果你来自桌面开发领域，感觉是不对的，但实际上我们必须使用我们现有的工具，移动网络正在发展，但在许多方面仍然是一个新的领域。

我来了这是因为我有同样的想法和问题，还有类似的情况——这个网站已经需要JavaScript，我正在开发一个一刀切的移动web应用程序，至少现在是这样。我们的发布周期真的很长-任何UA检测I硬代码在测试和发布代码时都会有些过时。由于此备用接口的目的是使其在较小的屏幕上工作，因此使用该测试似乎是有意义的。 然而，我不知道我会选择什么尺寸——我有一种预感，移动设备不受特定屏幕尺寸的限制（即使是按照惯例）。我想我们只需要决定主网页在什么时候不再起作用

---

我可以理解其他人对这种方法的犹豫，因为有时候移动设备上的标准站点除了屏幕大小之外还有其他问题。然而，我认为这种检测有一个优势。如果您唯一的问题是屏幕大小，我认为这是一个好办法。

Javascript移动设备屏幕高度检测根本不可靠。问题是不同的浏览器使用不同数量的“chrome”，不同的操作系统版本使用不同高度的系统栏。所有检测机构报告的高度不可靠（屏幕高度、窗口外部高度、窗口内部高度等）

宽度在所有操作系统的window.outerWidth上似乎是最可靠的

请在此处阅读最优秀的分析报告：

---

这取决于你想要实现什么

如果无论设备类型如何，都为不同的屏幕分辨率设计，则可以使用分辨率范围

如果您为特定的设备类型（手机、平板电脑等）设计，并假设分辨率范围始终与单个设备类型匹配，则最终会中断

您在示例中使用了

400px

阈值，Galaxy S8+报告

412x846

与此代码：

---

console.log（“宽度：+screen.width+”，高度：+screen.height）为什么不进行用户代理检测？使用尽可能多的变量来确定这样的事情是有意义的。此外，如果你试图针对某些设备，我想说用户代理检测比屏幕分辨率更可靠，例如“我想确保Windows Mobile Phone得到特殊处理”。此外，我想补充一点，用户代理检测将使测试更容易。然而，使用屏幕分辨率是非常好的，因为它是一种功能检测，并且使用这些信息来显示站点的“小屏幕”版本是非常可靠的。我在某种程度上同意，针对特定设备检测UA是一种方法，也适用于检测没有javascript的设备。但在我的具体案例中，js无论如何都需要运行网站+所有设备都有一个移动网站，因此屏幕分辨率似乎不仅更简单，而且是完全可靠的方法（因为UA可能被一些明智的移动运营商伪造或修改）