判断机型是安卓还是ios

 <div id="btn"><a onclick="detect" id="a"><button>打开app</button></a></div><script>var a = document.getElementById("a")// 1、 识别手机类型 var u = navigator.userAgentvar isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1//android终端 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)//ios终端 if (isAndroid) {a.href = "bb";} else {a.href = "aa";}//要求如果是安卓直接下载apk如果是苹果则先跳到苹果商城在下载</script>

今天公司要求判断不同的机型挑战不同的链接,由于平时关注的是业务的实现,很少关注终端的问题,因此也有一些方法基本忘完了,写下博客加深印象

navigator.userAgent获取浏览器信息(类型及系统)

// 各主流浏览器
function getBrowser() {//获取各个浏览器信息 navigator.userAgentvar u = navigator.userAgent;var bws = [{name: 'sgssapp',it: /sogousearch/i.test(u)}, {name: 'wechat',it: /MicroMessenger/i.test(u)}, {name: 'weibo', //微博it: !!u.match(/Weibo/i)}, {name: 'uc', //ucit: !!u.match(/UCBrowser/i) || u.indexOf(' UBrowser') > -1}, {name: 'sogou',//搜狗it: u.indexOf('MetaSr') > -1 || u.indexOf('Sogou') > -1}, {name: 'xiaomi',  //小米it: u.indexOf('MiuiBrowser') > -1}, {name: 'baidu',//百度it: u.indexOf('Baidu') > -1 || u.indexOf('BIDUBrowser') > -1}, {name: '360', //360it: u.indexOf('360EE') > -1 || u.indexOf('360SE') > -1}, {name: '2345',//2345it: u.indexOf('2345Explorer') > -1}, {name: 'edge',it: u.indexOf('Edge') > -1}, {name: 'ie11',//ie11版本it: u.indexOf('Trident') > -1 && u.indexOf('rv:11.0') > -1}, {name: 'ie', //ieit: u.indexOf('compatible') > -1 && u.indexOf('MSIE') > -1}, {name: 'firefox', //火狐it: u.indexOf('Firefox') > -1}, {name: 'safari',it: u.indexOf('Safari') > -1 && u.indexOf('Chrome') === -1}, {name: 'qqbrowser',it: u.indexOf('MQQBrowser') > -1 && u.indexOf(' QQ') === -1}, {name: 'qq',it: u.indexOf('QQ') > -1}, {name: 'chrome',//谷歌it: u.indexOf('Chrome') > -1 || u.indexOf('CriOS') > -1}, {name: 'opera',//欧朋it: u.indexOf('Opera') > -1 || u.indexOf('OPR') > -1}];//如果是上面的浏览器就返回他的名字否则返回otherfor (var i = 0; i < bws.length; i++) {if (bws[i].it) {return bws[i].name;}}return 'other';
}// 系统区分
function getOS() {var u = navigator.userAgent;//match方法匹配,常用于正则if (!!u.match(/compatible/i) || u.match(/Windows/i)) {return 'windows';} else if (!!u.match(/Macintosh/i) || u.match(/MacIntel/i)) {return 'macOS';} else if (!!u.match(/iphone/i) || u.match(/Ipad/i)) {return 'ios';} else if (!!u.match(/android/i)) {return 'android';} else {return 'other';}
}

下面来说下区分不同浏览器版本打开不同页面

首先要了解下面代码之前必须了解什么是edge,与ie有什么区别
不想去看的童鞋这里我简单提一句

,Edge浏览器和IE浏览器是两个不同的浏览器,Edge浏览器是随着Win10系统发布的,虽然Win10系统内依旧保留了ie浏览器,但系统默认浏览器已经是Edge了,而不是IE浏览器,
由于Edge浏览器抛弃了过往的包袱,所以Edge浏览器开发代码更为精简和优化,所带来的好处就是速度的提升和更加安全,Edge浏览器内核是使用微软全新开发的MSHTML渲染引擎,与IE浏览器完全不同,Edge浏览器要比IE11浏览器速度快两倍多。
除了速度和安全的改变之外,Edge浏览器将支持扩展插件,这是IE浏览器所不具备的,与Chrome和火狐扩展程序一样,Edge扩展程序必须利用HTML和JavaScript开发。
从实际的评测数据来看,Edge浏览器性能面对IE11是完胜,在Octane 2.0 JavaScript Benchmark这个项目上微软Edge领先幅度超过了50%!Kraken JavaScript Benchmark这个项目的优势也将近50%,无论在速度、性能、安全上,Edge浏览器都要比IE浏览器强大很多。

 <script src="js/jquery-1.8.3.min.js" charset="utf-8"></script><script>$(document).ready(function() {var num = IEVersion()//如果版本小于9则直接打开本页面显示使用高版本如果版本小于9则应打开live.html 就直接把打包好的文件名修改为live.html$('#text').hide()if (num > 9) {window.location.href = "live.html"} else {$('#text').show()}});function IEVersion() {var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串  var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器  var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器  var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;//判断内核if (isIE) {var reIE = new RegExp("MSIE (\\d+\\.\\d+);");reIE.test(userAgent);var fIEVersion = parseFloat(RegExp["$1"]);if (fIEVersion == 7) {return 7;} else if (fIEVersion == 8) {return 8;} else if (fIEVersion == 9) {return 9;} else if (fIEVersion == 10) {return 10;} else {return 6; //IE版本<=7}} else if (isEdge) {return 999; //edge} else if (isIE11) {return 11; //IE11  } else {return 99; //不是ie浏览器}}</script>
</head><body><div style="text-align: center; padding-top: 50px;" id="text">当前浏览器版本太低,请升级到IE10以上或用别的浏览器打开!(建议使用谷歌或者火狐浏览器)</div>
</body>

上面这段代码是判断兼容性的,如果你开发的项目不支持ie7以下的建议使用该代码,如果支持直接无视把

总结:由于平时不多看基础知识,导致曾经遇到过的判断系统信息都觉得麻烦,还是多看看底层原理把

判断机型是安卓还是ios相关推荐

  1. 安卓也是html写的么,css能判断手机是安卓还是ios吗?

    前端写web页面的时候会遇到安卓手机与iOS手机页面展示不一样,还有就是在写APP的时候,此时就会遇到判断手机类型.那么css能够判断手机类型是安卓还是ios吗? css能判断手机是安卓还是ios吗? ...

  2. android iphone css,css能判断手机是安卓还是ios吗?

    前端写web页面的时候会遇到安卓手机与iOS手机页面展示不一样,还有就是在写APP的时候,此时就会遇到判断手机类型.那么css能够判断手机类型是安卓还是ios吗? css能判断手机是安卓还是ios吗? ...

  3. 判断浏览器是否是微信,判断手机是安卓还是ios

    1.判断手机是安卓还是ios const u = navigator.userAgent; const iOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) ...

  4. 扫二维码时判断手机是安卓还是IOS

    1.使用情景,有个需要扫描二维码下载的APP,需要区分IOS和安卓,跳转到相应的下载链接去 var browser = { versions: function() { var u = navigat ...

  5. 小程序里头textarea在安卓和iOS下的兼容性问题

    小程序里头textarea在安卓和iOS下的兼容性问题 我最近才发现的一个问题,真令人头秃~~~~ 事儿是这样的,我负责编写的页面中有一个textarea输入框,当时没当回事儿,我自己测试的时候用自己 ...

  6. php 判断苹果还是安卓,android和ios调用php写的接口如何判断用户使用的是安卓还是苹果...

    如何能在不动安卓 和 苹果版本的前提下 php接口这边判断调用这个接口的是安卓还是苹果? 回复讨论(解决方案) function get_device_type(){ $agent = strtolo ...

  7. 判断访问接口的设备是安卓还是ios

    //判断是安卓还是ios function phontType(){//全部变成小写字母$agent = strtolower($_SERVER['HTTP_USER_AGENT']);$type = ...

  8. 判断当前手机设备的类型(安卓还是IOS)

    1.Java代码实现 判断当前手机设备类型是安卓还是IOS //判断手机端访问的设备是安卓还是苹果String userAgent = request.getHeader("user-age ...

  9. 判断当前系统是 安卓还是ios

    // 判断是否是 安卓 const isAndroid = () => {const u = navigator.userAgent;return u.includes('Android') | ...

最新文章

  1. Linux内存管理大图(第三稿)
  2. Redis 之布隆过滤器与布谷鸟过滤器
  3. [转]linux下的fms2流媒体服务器搭建六部曲之五-----flv播放器制作篇
  4. python 数据类型 、运算符
  5. Python列表基础
  6. el-table文字超出隐藏;el-table表格文字一行展示,超出隐藏,多余的内容会在 hover时显示 ;
  7. python程序跨平台桌面_Python中的跨平台桌面通知程序
  8. iptables_ftp
  9. 分布式对象存储 读书笔记(一) 开始
  10. matlab nntool教程,Matlab nntool 应用实例教材.doc
  11. 比较JavaScript中的集合及其检索效率
  12. word2007自动生成目录
  13. 用AS3+Flash+FlashBuilder开发AIR
  14. 混沌神经网络的实际应用,神经网络求解优化问题
  15. TreeMap自定义排序规则的两种方式
  16. java输入数字星期,输出英文
  17. 【Python 无损放大图片】——支持JPG/PNG 可将图片无损放大上万像素
  18. CTFd运维-CTFd平台搭好后,遇到网页访问慢,卡顿非常厉害的解决方法
  19. 还在每天standup会议吗?是时候尝试这个了。。。
  20. web前端超有用网站推荐

热门文章

  1. 惊!初中生也来卷了……
  2. php 炒粉,海南定安炒粉 - 美食小吃(图)_海南特产大全
  3. Doris Routine Load数据导入实战【每秒导入16w】
  4. java画圆、椭圆以及矩形
  5. J1-20:《英语辅导系统》关键算法
  6. linux关闭root权限管理,如何在Ubuntu中启用和禁用root帐户?
  7. 软件和office和word
  8. 经典或构思 不行错失的春夏美包
  9. 吃货联盟订餐系统(对象+数组)
  10. es6 删除数组指定元素