数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装学
法学如何用 JavaScript 检测移动设备？
在本教程中，我们将学习如何使用 JavaScript 检测我们正在使用的移动设备。
方法一：使用 navigator.userAgent 属性
为了用 JavaScript 检测移动设备，我们将使用 window navigator 对象，该对象包含有关浏览器的所有信息。我们将用来检测移动设备的属性是 userAgent 属性，该属性用于返回浏览器发送到服务器的用户代理标头。从此属性接收到的值是浏览器名称、版本和平台，即，您可以使用此函数获取有关移动设备的所有信息。
语法
使用 JavaScript 检测移动设备的语法如下：
window.navigator.userAgent ; or navigator.userAgent ;
步骤
使用 JavaScript 检测移动设备的步骤如下：
创建一个按钮并将其链接到名为 myfunction 的函数。
现在在函数中，我们将创建一个 if 循环。
在 if 循环内，我们将使用 navigator.userAgent 属性编写一些条件来检测任何移动设备。
我们编写的条件将查找每种类型的移动设备的匹配项，例如 Android、webOS、iPad、iPhone、iPod、BlackBerry 和 Windows Phone。
检查所有条件后，如果找到任何移动设备，则返回 true。
如果未找到任何移动设备，则我们将使用 else 循环在 'a' 变量中获取 false。
最后，将 a 的值打印到 answer 变量中，该变量链接到 id 为 result 的段落标签，以便在屏幕上打印 true 或 false 值
示例
我们可以使用以下 HTML 代码来使用 JavaScript 检测移动设备：
<!DOCTYPE html>
<html>
<head>
</head>
<body style="text-align:center;">
<button id="browse" onclick="myfunction()"> Check</button>
<p id="result">
</p>
<script>
var a;
var answer = document.getElementById("result"); function myfunction() {
if (navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/iPhone/i)
|| navigator.userAgent.match(/iPad/i)
|| navigator.userAgent.match(/iPod/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Windows Phone/i)) {
a = true ;
} else {
a = false ;
}
answer.innerHTML = a;
}
</script>
</body>
</html>
注意 − 要使上述代码的输出为“true”，您需要使用 Chrome 开发者工具运行代码，并选择手机选项。当您进入开发者工具的移动区域时，您可以从那里提供的移动设备列表中选择任何手机作为模拟器，以使用上述代码检测手机的存在。
运行代码后，窗口上将出现一个名为“检查”的按钮，单击该按钮可以检测手机。如果代码在任何移动设备上运行，则输出将为 true，否则将为 false。
方法二
但是，这种 user-agent 方法不是使用 JavaScript 检测移动设备的最佳方法，因为 user-agent 字符串很容易被伪造。因此，我们还可以使用 window.orientation 方法 来使用 JavaScript 检测移动设备，此方法检查设备视口的方位。它以度数提供某些值，例如 -90、0、90、180，所有这些值都表示不同的视口。如果视口的值大于 0，则表示该设备是移动设备，否则它不是移动电话。
注意 − 此功能已弃用，不再推荐
使用 JavaScript 检测移动设备的步骤如下：
创建一个按钮并将其链接到名为“myfunction”的函数。
现在在 script 标签内，我们将定义该函数。
创建一个名为 answer 的变量，并在其中使用 window.orientation 方法来检查方位值是否大于 -1。
在下一行，我们将调用 alert 方法，如果 answer 变量的值为 true，则该方法将打印值为“这是一部手机”。
否则，该值将显示为“这不是一部手机”。
示例
我们可以使用以下 HTML 代码来使用 JavaScript 检测移动设备：
<!DOCTYPE html>
<html>
<head>
</head>
<body style="text align:center;">
<button id="browse" onclick="myfunction()">Check</button>
<script>
function myfunction() {
var answer = window.orientation > 1;
alert(answer ? 'It is a mobile device' : 'It is not a mobile device');
}
</script>
</body>
</html>
注意 − 要检查此代码的输出，我们需要使用与上述代码中使用的相同的 Chrome 开发者工具。
如果代码在模拟器手机上运行，我们将收到“这是一部手机”的警报；否则，我们将得到“这不是一部手机”的输出。
65,000+ 次浏览
