×

JavaScript来检测是否为移动设备

作者:andy0012020.01.17来源:Web前端之家浏览:542评论:0
关键词:js移动

在响应式项目里,需要对移动端进行特殊的业务逻辑判断,我们如何去判断呢?下面介绍几种方法:

方法1:使用window.matchmedia()方法

在JavaScript中,可以使用window.matchmedia()方法来检测基于CSS媒体查询的移动设备;这是检测移动设备的最佳和最简单的方法。

语法:

window.matchMedia();

示例:在移动设备上运行

<script>
	if(window.matchMedia("(max-width: 750px)").matches) {

		// 视图端口的宽度小于750像素
		document.write("这是一个移动设备。");
	} else {

		// 视图端口至少有750像素宽
		document.write("这是一个pc电脑端或平板。");
	}
</script>

判断设备的视图端口,如果宽度小于750像素则为移动设备。

方法2:使用navigator.userAgent属性

navigator.userAgent属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值。

示例:

<script>
	if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
		document.write("这是一个移动设备。");
	} else {
		document.write("这是一个pc电脑端。");
	}
</script>

温馨提示:本文作者系 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
http://www.jiangweishan.com/article/js8udosufioudiou.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2019 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.5.2 Zero