在做 Web 前端开发中,经常要考虑到 pc 端和移动端对功能的不同需求,这时候通常需要根据设备的不同做到一定的响应,这时候可以通过媒体查询实现不同设备宽度下的不同样式,也可以通过判断访问设备的类型,通过判断的结果,返回不同的域名地址,继而加载不同的 CSS 文件。
那么如何判断页面是由移动端还是 PC 端打开呢,也就是说怎么判断访问设备的类型呢?
1.媒体查询,但是这个只能判断尺寸,并不能判断是不是移动设备。
2.通过 user-agent 值,来进行判断。使用 javascript 框架中的 Navigator 对象的 userAgent 属性。
/**
* 判断是否是pc设备
*/
function IsPC() {
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone","SymbianOS", "Windows Phone", "iPod"];
var flag = true;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = false;
break;
}
}
if(window.screen.width>=768){
flag = true;
}
return flag;
}
通过以上代码就可以判断出访问网站的设备类型到底是 PC 端还是移动端。
转自 Silenss 的 CSDN 博客:https://blog.csdn.net/u013583619/article/details/52874611
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于