news 2026/9/5 20:23:20

vue - JS 判断客户端是苹果 iOS 还是安卓 Android(封装好的方法直接调用)二种解决方案

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
vue - JS 判断客户端是苹果 iOS 还是安卓 Android(封装好的方法直接调用)二种解决方案

介绍

有时候我们的项目,可能需要判断用户处于苹果还是安卓手机上,这时候就需要判断了。

其实,通过浏览器的navigator.userAgent API判断就行,下面提供两种方法自行选择。

解决方案 1

如下代码所示:

letu=navigator.userAgent;letisAndroid=u.indexOf('Android')>-1||u.indexOf('Adr')>-1;//判断是否是 android终端letisIOS=!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);//判断是否是 iOS终端console.log('是否是Android:',isAndroid);//true,falseconsole.log('是否是iOS:',isIOS)

封装成方法,方便多处调用:

// 检查客户端judgeClient(){letu=navigator.userAgent;letisAndroid=u.indexOf('Android')>-1||u.indexOf('Adr')>-1;//判断是否是 android终端letisIOS=!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);//判断是否是 iOS终端console.log('是否是Android:'+isAndroid);//true,falseconsole.log('是否是iOS:'+isIOS);if(isAndroid){return'Android';}elseif(isIOS){return'IOS';}else{return'PC';}},

解决方案 2

与前面的类似,但是写法不同:

if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)){console.log('isIOS');}elseif(/(Android)/i.test(navigator.userAgent)){console.log('isAndroid');}else{console.log('isPC');}

封装成方法:

// 检查客户端judgeClient(){letclient='';if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)){//判断iPhone|iPad|iPod|iOSclient='iOS';}elseif(/(Android)/i.test(navigator.userAgent)){//判断Androidclient='Android';}else{client='PC';}returnclient;},

写在后面

其实两种方案都差不多,看你自己的选择了,哪个更适合。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/9/2 22:30:03

MedGemma X-Ray保姆级教程:从部署到生成结构化报告

MedGemma X-Ray保姆级教程:从部署到生成结构化报告 这是一份真正面向临床与科研一线用户的实操指南。不讲抽象原理,不堆技术参数,只说你打开服务器后第一步点哪里、第二步输什么、第三步看哪行日志、第四步怎么判断成功了。无论你是刚接触AI的…

作者头像 李华
网站建设 2026/9/2 22:30:24

OpenDataLab MinerU部署教程:从零开始搭建高密度文档解析系统

OpenDataLab MinerU部署教程:从零开始搭建高密度文档解析系统 1. 为什么你需要一个专精文档的AI模型 你有没有遇到过这样的场景:手头有一份扫描版PDF论文,想快速提取其中的公式和表格数据,却只能手动抄写;或者收到一…

作者头像 李华
网站建设 2026/9/2 22:30:26

MGeo基础版vs增强版:选哪个更适合你

MGeo基础版vs增强版:选哪个更适合你 地址相似度匹配是地理信息处理中的核心任务之一,尤其在政务数据治理、物流地址清洗、POI融合、地图纠错等场景中,能否准确判断“北京市朝阳区建国路87号”和“北京朝阳建国路八十七号”是否指向同一地点&…

作者头像 李华
网站建设 2026/9/4 18:54:31

FLUX.1-dev部署案例:NVIDIA L40S服务器集群部署FLUX.1-dev推理服务

FLUX.1-dev部署案例:NVIDIA L40S服务器集群部署FLUX.1-dev推理服务 1. 为什么是FLUX.1-dev旗舰版? 你可能已经用过不少图像生成模型,但FLUX.1-dev真的不一样。它不是又一个“差不多能用”的开源模型,而是目前开源社区里少有的、…

作者头像 李华
网站建设 2026/9/3 6:37:49

蛋白质测序常见问题汇总(二)

蛋白质测序常见问题汇总(二)上期给大家汇总了一些有关蛋白质测序原理的基础知识,这期着重给大家列举一些蛋白质测序实验中新手可能想问的问题,希望对网接触蛋白质测序的实验新手在选择蛋白质测序方法上有指导性帮助。1、蛋白质样品…

作者头像 李华
网站建设 2026/9/2 22:13:10

零基础玩转FLUX.1文生图:SDXL风格提示词实战指南

零基础玩转FLUX.1文生图:SDXL风格提示词实战指南 1. 为什么你该关注FLUX.1——不是又一个“参数堆砌”,而是提示词友好型新范式 你可能已经试过SDXL,也踩过SD3的坑:人体结构翻车、文字生成模糊、复杂提示词直接“听不懂”。但当…

作者头像 李华