js快速判断设备终端是ios还是android

在移动端开发过程中,有些 H5 页面在界面设计时,安卓设备和苹果设备会有一些区别。

所以我们可以通过 js 来快速判断 H5 页面渲染在哪种移动设备上,然后根据不同的移动设备来分别渲染不同的界面设计效果,来保证设计的效果图的还原度和落地。

下面一小段代码来快速实现判断,限于移动设备浏览器中渲染的页面。

js代码

javascript 复制代码
var u = navigator.userAgent; //获取标识

var android = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;  //android

var ios = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);  //ios

console.log('是否是android:'+android ); //打印结果

console.log('是否是ios:'+ios ); //打印结果

userAgent 是 HTTP 请求中的用户标识,声明了浏览器用于 HTTP 请求的用户代理头的值。

通过 navigator.userAgent 来获取当前设备的浏览器类型及系统,通过 js 提炼判断是安卓设备还是苹果设备,然后打印结果。

在实际开发中,还可以对这段代码进行补充和封装,完善其它浏览器类型及系统。


1\] ​​[原文阅读​​](https://mp.weixin.qq.com/s/tsAp12I9Oj7o0oo8Gcnbpw) 我是 Just,听说长的好看的都关注 `订阅号[ 设计师工作日常 ]` 了!skr\~ skr\~ skr\~

相关推荐
Van_captain3 分钟前
rn_for_openharmony常用组件_Breadcrumb面包屑
javascript·开源·harmonyos
静听松涛1339 分钟前
提示词注入攻击的防御机制
前端·javascript·easyui
stevenzqzq9 分钟前
Android Studio 断点调试核心技巧总结
android·ide·android studio
晚风予星14 分钟前
简记 | 一个基于 AntD 的高效 useDrawer Hooks
前端·react.js·设计
栗子叶18 分钟前
网页接收服务端消息的几种方式
前端·websocket·http·通信
菩提小狗22 分钟前
Sqli-Labs Less-3 靶场完整解题流程解析-豆包生成
前端·css·less
澄江静如练_27 分钟前
优惠券提示文案表单项(原生div写的)
前端·javascript·vue.js
C_心欲无痕31 分钟前
ts - 关于Object、object 和 {} 的解析与区别
开发语言·前端·javascript·typescript
L Jiawen36 分钟前
【Windows 系统】Chrome浏览器退出登录状态失效
前端·chrome·windows
IT_陈寒1 小时前
Java并发编程实战:从入门到精通的5个关键技巧,让我薪资涨了40%
前端·人工智能·后端