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 ​​原文阅读​​

我是 Just,听说长的好看的都关注 订阅号[ 设计师工作日常 ] 了!skr~ skr~ skr~

相关推荐
摸鱼老王不带85 分钟前
不用后端,纯前端读出"网站眼里你的真实出口 IP"——聊聊 Cloudflare 的 cdn-cgi/trace
前端
程序员黑豆16 分钟前
鸿蒙开发入门:Row 和 Column 布局组件详解
前端·harmonyos
祉猷并茂,雯华若锦29 分钟前
Appium 3.x安卓按键与通知栏操作全指南
android·appium
hoLzwEge38 分钟前
前端环境变量配置指南:.env 文件详解
前端·前端框架
猫头_1 小时前
AI 流式传输工程指南:有了 EventSource 为何还要 Fetch?
javascript·http·llm
码农coding1 小时前
android 12 SurfaceFlinger开机启动分析
android
hunterandroid1 小时前
Paging 3 RemoteMediator 实战:构建离线优先的分页列表
android·前端
Underwood_171 小时前
星级评价——了解useState
前端
hunterandroid1 小时前
[鸿蒙从零到一] ArkUI 组件化实战:构建可复用、可组合的自定义组件
前端·华为·架构
一只公羊1 小时前
iPhone摄像头 在开发/调试过程中强行停止 App,导致 `AVCaptureSession` 没有被正常释放
前端