js判断客户端是iOS还是Android等移动终端的方法


Posted in Javascript onDecember 11, 2013

判断原理:

JavaScript是前端开发的主要语言,我们可以通过编写JavaScript程序来判断浏览器的类型及版本。JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性来分辨,另一种是通过分析浏览器的userAgent属性来判断的。在许多情况下,值判断出浏览器类型之后,还需判断浏览器版本才能处理兼容性问题,而判断浏览器的版本一般只能通过分析浏览器的userAgent才能知道。

浏览器类型

⑴浏览器特有属性
⑵根据userAgent
浏览器版本
⑴根据userAgent

对于手机浏览器判断

1.如何判断是否为移动终端 利用正则match,
匹配navigator.userAgent是否含有字符串AppleWebKit*****Mobile
安卓qq浏览器HD版 只有AppleWebKit

2手机语言版本的判断
使用navigator.browserLanguage 便可得出windows phone语言版本,
当然可恶的小小手机语言版本也有兼容性的差异,兼容Mozilla,以及AppleWebKit内核的浏览器访问其语言版本,它会列出 navigator.language
CODE:

<script type="text/javascript"> 
var browser={ 
versions:function(){ 
var u = navigator.userAgent, app = navigator.appVersion; 
return { //移动终端浏览器版本信息 
trident: u.indexOf('Trident') > -1, //IE内核 
presto: u.indexOf('Presto') > -1, //opera内核 
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核 
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核 
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端 
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端 
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器 
iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器 
iPad: u.indexOf('iPad') > -1, //是否iPad 
webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部 
}; 
}(), 
language:(navigator.browserLanguage || navigator.language).toLowerCase() 
} 
document.writeln("语言版本: "+browser.language); 
document.writeln(" 是否为移动终端: "+browser.versions.mobile); 
document.writeln(" ios终端: "+browser.versions.ios); 
document.writeln(" android终端: "+browser.versions.android); 
document.writeln(" 是否为iPhone: "+browser.versions.iPhone); 
document.writeln(" 是否iPad: "+browser.versions.iPad); 
document.writeln(navigator.userAgent); 
</script>

比较特别的地方
UC浏览器没有安卓报头,只返回:linux ,这里粗略的根据linux来判断是安卓(前提必须满足是移动终端,UC这点是满足的)
安卓QQ浏览器HD版检测的结果是:mac, Safari
Javascript 相关文章推荐
jQuery 白痴级入门教程
Nov 11 Javascript
JavaScript函数的4种调用方法详解
Apr 22 Javascript
使用JavaScript获取电池状态的方法
May 03 Javascript
javascript实现youku的视频代码自适应宽度
May 25 Javascript
基于jQuery实现Div窗口震动特效代码-代码简单
Aug 28 Javascript
JS组件Bootstrap ContextMenu右键菜单使用方法
Apr 17 Javascript
JavaScript知识点总结(十一)之js中的Object类详解
May 31 Javascript
js读取本地文件的实例
Dec 22 Javascript
JavaScript函数式编程(Functional Programming)箭头函数(Arrow functions)用法分析
May 22 Javascript
如何给element添加一个抽屉组件的方法步骤
Jul 14 Javascript
layui在form表单页面通过Validform加入简单验证的方法
Sep 06 Javascript
vue实现路由监听和参数监听
Oct 29 Javascript
js+css 实现遮罩居中弹出层(随浏览器窗口滚动条滚动)
Dec 11 #Javascript
按下Enter焦点移至下一个控件的实现js代码
Dec 11 #Javascript
JS中window.open全屏命令解析及使用示例
Dec 11 #Javascript
js的匿名函数使用介绍
Dec 11 #Javascript
jquery ajax jsonp跨域调用实例代码
Dec 11 #Javascript
JavaScript Math.ceil() 函数使用介绍
Dec 11 #Javascript
Javascript实现返回上一页面并刷新的小例子
Dec 11 #Javascript
You might like
十大“创意”战术!
2020/03/04 星际争霸
用PHP制作静态网站的模板框架
2006/10/09 PHP
php使用Jpgraph绘制柱形图的方法
2015/06/10 PHP
php算法实例分享
2015/07/14 PHP
php封装的smartyBC类完整实例
2016/10/19 PHP
微信公众号实现会员卡领取功能
2017/06/08 PHP
PHP基于ORM方式操作MySQL数据库实例
2017/06/21 PHP
动态为事件添加js代码示例
2009/02/15 Javascript
jquery 简单导航实现代码
2009/09/11 Javascript
JavaScript 保存数组到Cookie的代码
2010/04/14 Javascript
jQuery $.data()方法使用注意细节
2012/12/31 Javascript
JS打开层/关闭层/移动层动画效果的实例代码
2013/05/11 Javascript
js setTimeout()函数介绍及应用以倒计时为例
2013/12/12 Javascript
checkbox全选所涉及到的知识点介绍
2013/12/31 Javascript
JavaScript对象封装的简单实现方法(3种方法)
2017/01/03 Javascript
js实现微博发布小功能
2017/01/12 Javascript
js实现五星评价功能
2017/03/08 Javascript
Windows下Node.js安装及环境配置方法
2017/09/18 Javascript
JavaScript中立即执行函数实例详解
2017/11/04 Javascript
js获取浏览器地址(获取第1个斜杠后的内容)
2019/09/03 Javascript
Python3.2模拟实现webqq登录
2016/02/15 Python
PyCharm使用教程之搭建Python开发环境
2016/06/07 Python
python实现八大排序算法(2)
2017/09/14 Python
解决python 3 urllib 没有 urlencode 属性的问题
2019/08/22 Python
PyTorch学习:动态图和静态图的例子
2020/01/06 Python
python对象销毁实例(垃圾回收)
2020/01/16 Python
离线状态下在jupyter notebook中使用plotly实例
2020/04/24 Python
英国受欢迎的运动鞋和街头服装商店:Footasylum
2018/06/12 全球购物
会计系中文个人求职信
2013/12/24 职场文书
党日活动总结
2014/05/07 职场文书
艺术学院毕业生求职信
2014/07/09 职场文书
创建绿色学校先进个人材料
2014/08/20 职场文书
2015年度优秀员工自荐书
2015/03/06 职场文书
预备党员介绍人意见
2015/06/01 职场文书
文案策划岗位个人自我评价(范文)
2019/08/08 职场文书
在vue中import()语法不能传入变量的问题及解决
2022/04/01 Vue.js