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~

相关推荐
mCell12 小时前
【锐评】桌面端技术营销:别拿跑分当工程判断
前端·rust·electron
柒和远方13 小时前
从一次工程审查看 AI 学习产品的边界兜底:RAG 资料链路一致性实战
前端·后端·架构
疯狂的魔鬼13 小时前
一个"懂分寸"的文本省略组件是怎样炼成的
前端·vue.js·设计
angerdream13 小时前
手把手编写儿童手机远程监控App之vue3 AI Gent
前端
李明卫杭州13 小时前
CSS BFC 完全指南:从原理到实战,彻底搞懂这个"结界"
前端
裕波13 小时前
AI 正在重写应用开发。Vue 与 Vite,给出新的答案。
javascript·vue.js
Momo__13 小时前
MDN MCP Server——Mozilla 把 Web 文档接进 AI Agent,从此 LLM 不再瞎编 API
前端·ai编程·mcp
妙码生花13 小时前
现代前端的极致性能 icon 加载方案(死磕成功版)
前端·vue.js·typescript
掘金者阿豪14 小时前
把业务数据变成共享仪表盘:Metabase可视化与远程访问实践
前端·后端
kyriewen14 小时前
折腾了半年 AI 编程工作流,最后发现效率瓶颈是桌上那块屏幕
前端·javascript·ai编程