<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 || u.indexOf(
'Mac'
) > -1,
//是否为iPhone或者QQHD浏览器
iPad: u.indexOf(
'iPad'
) > -1,
//是否iPad
webApp: u.indexOf(
'Safari'
) == -1
//是否web应该程序,没有头部与底部
};
}(),
language: (navigator.browserLanguage || navigator.language).toLowerCase()
}
if
(browser.versions.mobile ==
true
|| browser.versions.ios ==
true
|| browser.versions.android ==
true
) {
if
(confirm(
"检测到您是移动终端!是否跳转至手机版?"
))
{
window.location.href =
"http://3geas.huat.edu.cn"
;
}
}
</script>
<script src=
"http://siteapp.baidu.com/static/webappservice/uaredirect.js"
type=
"text/javascript"
></script>
<script type=
"text/javascript"
>uaredirect(
"http://www.163.com"
);</script>
function uaredirect(f)
{
try{
if(document.getElementById("bdmark")!=null)
{return}
var b=false;
if(arguments[1]){
var e=window.location.host;
var a=window.location.href;
if(isSubdomain(arguments[1],e)==1){
f=f+"/#m/"+a;
b=true
}else{
if(isSubdomain(arguments[1],e)==2){
f=f+"/#m/"+a;b=true
}else{
f=a;b=false}
}
}else{
b=true}
if(b){
var c=window.location.hash;
if(!c.match("fromapp")){
if((navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i))){location.replace(f)}}}}catch(d){}}function isSubdomain(c,d){this.getdomain=function(f){var e=f.indexOf("://");if(e>0){var h=f.substr(e+3)}else{var h=f}var g=/^www\./;if(g.test(h)){h=h.substr(4)}return h};if(c==d){return 1}else{var c=this.getdomain(c);var b=this.getdomain(d);if(c==b){return 1}else{c=c.replace(".","\\.");var a=new RegExp("\\."+c+"$");if(b.match(a)){return 2}else{return 0}}}
};
前文《Web开发兼容性系列文章(一):不同设备浏览器的userAgent值大全》罗列了常用电脑浏览器及智能手机浏览器的userAgent值
这里对浏览器各自的userAgent特点做一分析,并给出判断方法:
Windows操作系统浏览器系列:
- IE浏览器系列:
特征表现:均以 "mozilla/" 开头,"msie x.0;" 中的x表示其版本;
判断方法:粗略判断可以只检索 "msie x.0;" 字符串即可,严格判断可检索 "mozilla/x.0 (compatibal; msie x.0; windows nt",不过一般没有这个必要 - Windows版Firefox:
特征表现:以"mozilla/x.0"开头,包含"windows nt","gecko/"和"firefox/" ;
判断方法:粗略判断可以只检索 "firefox/"和"windows nt" 字符串,严格判断可以检索"mozilla/" ,"windows nt","gecko/"和"firefox/" 四个字符串; - Windows版Chrome:
特征表现: 以"mozilla/x.0"开头,包含"windows nt","chrome/",同时包含"applewebkit/","safari/";
判断方法:粗略判断可以只检索 "windows nt"和"chrome/"字符串,严格判断可以同时检索 "mozilla/" ,"windows nt","applewebkit/","safari/","chrome/" 五个字符串; - Windows版Opera:
特征表现:以"opera/"开头,含有"windows nt","presto/" 字符串;
判断方法:粗略判断只检索 "windows nt"和"opera/"字符串,严格判断同时检索 "opera/","windows nt" 和 "presto/"; - Windows版Safari:
特征表现:以"mozilla/"开头,同时含有"windows nt","applewebkit/","safari/";
判断方法:粗略判断可以检索含有 "windows nt","safari/" 同时不包含 "chrome/",严格判断需要同时含有"mozilla/","windows nt","applewebkit/","safari/"但是不包含"chrome/"; - 小结:Windows操作系统上的浏览器userAgent均包含"windows nt"字符串来表征windows操作系统。
iPhone平台浏览器系列:
- iPhone自带safari:
特征表现:以"mozilla/"开头,含有"iphone"字符串,同时含有 "mobile/","safari/"字符串;
判断方法:粗略判断只检索 "iphone"和"safari/"字符串,严格判断则要同时包含 "mozilla/","iphone","mobile/","safari/"四个字符串 - iPhone版Opera Mobile:
特征表现: 以"opera/"开头,含有"iphone"字符串,同时含有 "opera mini/","presto/"字符串;
判断方法:粗略判断只检索 "iphone"和"opera/"字符串,严格判断则要同时包含 "opera/","iphone","opera mini/","presto/"四个字符串 - 小结:iPhone手机上的浏览器userAgent均包含"iphone"字符串
Android平台浏览器系列:
- Android自带浏览器(有人说其实是就chrome,但google自己未做表示,且还在开发一个Android上运行的Chrome to Phone):
特征表现: 以"mozilla/"开头,含有"android"和"linux" 字符串,同时含有 "applewebkit/","mobile safari/"字符串;
判断方法:因为还不知道Android上未来会不会有独立的safari(估计不会了),所以建议直接严格判断,检索 "mozilla/","android","linux","applewebkit/","mobile safari/"五个字符串 - Android版Opera Mobile:
特征表现: 以"opera/"开头,含有"android"和"linux" 字符串,同时含有 "opera mobi/","presto/"字符串;
判断方法:粗略判断只检索 "android"和"opera/",严格判断则要同时包含"opera/","android","linux","opera mobi/","presto/"五个字符串 - Android版Firefox:
特征表现:以"mozilla/"开头,含有"android"和"linux" 字符串,同时含有 "firefox/","gecko/","fennec/"字符串;
判断方法:粗略判断只检索 "android"和"firefox/",严格判断则要同时包含"mozilla/","android","linux","firefox/","gecko/","fennec/"六个字符串 - 小结:Android平台上的浏览器userAgent均包含"android"和"linux"字符串
以上对windows、iphone、android三大平台的主流浏览器解析就基本结束了,其他平台的linux估计至少与android平台应该类似,而采用了Mac OS的iPad和麦金塔应该与iphone平台类似,故而暂时先不做解析,也因为手头没有那么多设备和操作系统来测试,希望日后能够补上。
现在的网站产品开发要求跟以前又不一样了,因为不仅要满足电脑浏览,还需要满足用户通过智能手机(这里仅指iphone、android、windows phone等真正的智能手机,blackberry和palm这样的小众半智能系统暂时不考虑,至于symbian这个伪智能系统就一边玩去吧)通过以上三个具有代表性的平台,也大致可以推测出根据浏览器userAgent判断用户设备的解决方案了。
1、如果需要判断操作系统,方法比较简单,在userAgent里面检索以下字符串:
- 含有"windows nt":显而易见了,windows操作系统,nt后面的版本号可以判断OS版本;
- 含有"mac":苹果的Mac OS X或者其他Mac OS内核的系统;
- 含有"iphone":苹果iphone手机专有的,一般情况下也应该含有"mac";
- 含有"ipad":苹果iPad平板电脑(资料表明iPad的浏览器userAgent同时含有"mac","iphone","ipad");
- 含有"linux":Linux操作系统或者其他以linux作为内核的操作系统;
- 含有"android":谷歌的Android操作系统,有可能是智能手机,也有可能是安卓版的平板电脑哦,一般情况下android平台上的userAgent也应该包含"linux";
- 含有"unix","sunos","bsd"三者之一:Unix系统,其实对这个系统的用户体验问题,目前几乎可以不用考虑了;
- 含有"ubuntu":ubuntu定制版的linux
- ……
2、判断浏览器的内核,方法也不困难,我自己琢磨出来的,不一定都对啊:
- IE(Trident)内核(IE for Mac, IEs4Linux之类的就不用说了,只考虑windows下的):以"mozilla/"开头,含有"windows nt"和"msie"字符串;
- Firefox(Gecko)内核:以"mozilla/"开头,含有"firefox/"和"gecko/"字符串的就是啦,其中Android版的还带有"fennec/"字符串;
- Opera()内核:以"opera/"开头,含有"presto/"字符串,其中iphone版还带有"opera mini/",Android版也带有"opera mobi/";
- Webkit内核:以"mozilla/"开头,含有"applewebkit/"和"safari/"字符串,其中带有"chrome/"的就是Chrome浏览器,不带的就是Safari或其他;
- 以上就是主要的浏览器内核了
3、判断浏览器useAgent的实际应用举例:
- 不同浏览器内核对页面的渲染效果不同,虽然已经有jQuery和Extjs等为我们做了兼容处理,但是依然会有一些细小的差别需要我们单独处理,此时需要判断浏览器内核;
- 用户并不仅仅是通过电脑访问网站的,随着智能手机的日益普及还有平板电脑的大行其道,使用这两者来上网的比例越来越高,怎么办?平板电脑还好,屏幕大分辨率高,智能手机受限于他的屏幕尺寸和分辨率,虽有强劲的处理能力,也可以完美支持现有的网站,但是为客户多考虑一点总没有坏处你说对吧?毕竟通过局部缩放拖拽的方式看网页很不舒服,这时呢,我们就可以专门为iphone、android这样的窄条屏幕提供一个专用版本来布局了,一来提升浏览体验,二来降低网络流量,加快访问速度;
- 做访客流量分析,通过判断客户浏览器类型并记录其数量,来优化设计自己的网站,以分别提升其客户体验
js判断移动终端(手机浏览器)的更多相关文章
-
js判断是否为手机浏览器
JS判断手机浏览器 判断原理: JavaScript是前端开发的主要语言,我们可以通过 编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根 ...
-
JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器
JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器 var ua = navigator.userAgent; var browser = {}, weixin ...
-
js、php 判断用户终端 、浏览器类型
js 判断 用户使用终端 function isMobeil() { if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iP ...
-
js判断是否为手机访问
JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性来分辨,另一种是通过分析浏览器的userAgent属性来判断的.在许多情况下,值判断出浏览器类型之后,还需判断浏览器版本 ...
-
js判断访问终端
//判断访问终端 var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; ...
-
js判断是否是ie浏览器且给出ie版本
之前懒得写判断ie版本js,因为网上关于这方面的代码太多了,所以从网上拷贝了一个,放到项目上才发现由于时效性的问题,代码不生效.就自己写一个吧. 怎么去看浏览器的内核等信息 ---- js的全局对象w ...
-
php 通过http user-agent判断是否为手机浏览器
<?php/*** 判断是否是通过手机访问* @return bool 是否是移动设备 */public function isMobile() { //判断手机发送的客户端标志 if ...
-
js 判断访问终端类型
// 判断访问终端类型 var browser = { versions: function() { var u = navigator.userAgent, app = navigator.appV ...
-
js判断是哪种浏览器和阻止页面加载
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
-
js判断是否是微信浏览器以及重定向
async created () {//这个是判断是否是微信浏览器, let ua = navigator.userAgent.toLowerCase() if (ua.match(/MicroMes ...
随机推荐
-
VMWare虚拟机下为Ubuntu 12.04.1配置静态IP(NAT连接方式)
背景 在虚拟机下运行操作系统,尤其是Linux系统已经是非常常见的做法.有时你想在虚拟机下搭建一个(模拟)服务器来供主机访问,比如搭建一个telnet/ssh.此时你会发现,每次启动虚拟机,VMWar ...
-
(小常识)Dictionary的遍历
Dictionary<int, string> objDictionary = new Dictionary<int, string>(); ...
-
Oracle 免费的数据库--Database 快捷版 11g 安装使用与";SOD框架";对Oracle的CodeFirst支持
一.Oracle XE 数据库与连接工具安装使用 Oracle数据库历来以价格昂贵出名,当然贵有贵的道理,成为一个Oracle DBA也是令人羡慕的事情,如果程序员熟悉Oracle使用也有机会接触到大 ...
-
Factor Combinations
Factor Combinations Problem: Numbers can be regarded as product of its factors. For example, 8 = 2 x ...
-
Android学习笔记(八)深入分析Service启动、绑定过程
Service是Android中一个重要的组件,它没有用户界面,可以运行在后太做一些耗时操作.Service可以被其他组件启动,甚至当用户切换到其他应用时,它仍然可以在后台保存运行.Service 是 ...
-
getNextElement( )函数——获取下一个特定的元素节点
function getNextElement(node){ //定义getNextElement()函数 if (node.nodeType==){ //条件:如果node参数nodetype属性为 ...
-
Markdown中使用mermaid画流程图
Markown语法简单,用来写文档是个不错的选择. 但是Markdown 语法并不直接支持画图,当然方法还是有的. 本人用的Markdown编辑器为vscode,在里面直接安装merdaid插件即可使 ...
-
Duplicate entry &#39;0&#39; for key &#39;PRIMARY&#39;的一种可能的解决办法
在MySQL设计好数据库往往数据库中插入数据的时候, 因为主键ID默认是不赋值的,只给其他项目赋值了,相关的SQL代码是这样的 StringBuilder strSql = new StringBui ...
-
Swift基础之Animation动画研究
最近研究了一下,Swift语言中关于Animation动画的实现学习,分两次进行相关内容的讲解 用表格列出各种动画情况 Demo首页显示展示了一种动画显示方式,代码如下: //绘画装饰 func ...
-
Typecho博客迁移
在新的机器上先搭建好一个新的Typecho博客,数据库名称和原博客相同(可以省不少事). 备份原来博客的usr目录. 备份mysql数据库,命令: mysqldump -uroot -p --all- ...