JS 判断运行当前脚本的应用程序是否为手机端或者一些其他信息，在我的工作中遇到的不是十分频繁，被我的同事一问就给问住了，所以把之前找到的一些知识点整理出来，供大家参考，若哪里不对欢迎指出，我会及时的更改 (#^.^#)。

 window.navigator

先从这个属性入手：window.navigator 返回一个navigator对象的引用，可以用它来查询一些关于运行当前脚本的应用程序的相关信息。

常用属性和方法：（想知道详细属性和方法的请点MDN）

Navigator 对象属性

属性 说明
appCodeName 返回当前浏览器的内部“代码”名称,该名称可能是不"正确"的.
appName 返回当前浏览器的正式名称,该名称可能是不"正确"的.
appVersion 返回当前浏览器的版本号,该值可能是不"正确"的.
cookieEnabled 返回一个布尔值,表明当前浏览器是否启用了cookies.
platform 返回一个字符串,表明当前所使用的系统平台类型.
userAgent 返回当前浏览器的user agent字符串.

Navigator 对象方法

方法 描述
javaEnabled() 表明当前浏览器是否启用了对Java的支持.
vibrate() 如果设备支持震动(手机或其他),则触发设备震动.
registerContentHandler 允许网站将自己注册成为一个给定MIME类型的内容的处理程序.

eg:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="test"></div>
<script>
txt = "<p>浏览器代号: " + navigator.appCodeName + "</p>";
txt+= "<p>浏览器名称: " + navigator.appName + "</p>";
txt+= "<p>浏览器版本: " + navigator.appVersion + "</p>";
txt+= "<p>启用Cookies: " + navigator.cookieEnabled + "</p>";
txt+= "<p>硬件平台: " + navigator.platform + "</p>";
txt+= "<p>用户代理: " + navigator.userAgent + "</p>";
txt+= "<p>用户代理语言: " + navigator.systemLanguage + "</p>";
document.getElementById("test").innerHTML=txt;
</script>
</body>
</html>

常用跳转代码

<script type="text/javascript"> 
 // borwserRedirect
 (function browserRedirect(){
  var sUserAgent = navigator.userAgent.toLowerCase();
  var bIsIpad = sUserAgent.match(/ipad/i) == 'ipad';
  var bIsIphone = sUserAgent.match(/iphone os/i) == 'iphone os';
  var bIsMidp = sUserAgent.match(/midp/i) == 'midp';
  var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == 'rv:1.2.3.4';
  var bIsUc = sUserAgent.match(/ucweb/i) == 'web';
  var bIsCE = sUserAgent.match(/windows ce/i) == 'windows ce';
  var bIsWM = sUserAgent.match(/windows mobile/i) == 'windows mobile';
  var bIsAndroid = sUserAgent.match(/android/i) == 'android';
  if(bIsIpad || bIsIphone || bIsMidp || bIsUc7 || bIsUc || bIsCE || bIsWM || bIsAndroid ){
  window.location.href = '跳转的移动端网址';
  }
 })();
 </script>
<script type="text/javascript"> 
<!-- 
  //平台、设备和操作系统 
  var system = { 
   win: false, 
   mac: false, 
   xll: false, 
   ipad:false
  }; 
  //检测平台 
  var p = navigator.platform; 
  system.win = p.indexOf("Win") == 0; 
  system.mac = p.indexOf("Mac") == 0; 
  system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); 
  system.ipad = (navigator.userAgent.match(/iPad/i) != null)?true:false; 
  //跳转语句，如果是手机访问就自动跳转到wap.baidu.com页面 
  if (system.win || system.mac || system.xll||system.ipad) { 

//  something....

  } else { 
   window.location.href = "PC端网址"; 
  } 
--> 
</script>

腾讯跳转

<script type="text/javascript">
if(window.location.toString().indexOf('pref=padindex') != -1){
}else{
 if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){ 
  if(window.location.href.indexOf("?mobile")<0){
  try{
   if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
    window.location.href="手机端网址";
   }else if(/iPad/i.test(navigator.userAgent)){
    //window.location.href="pad网址"
   }else{
    window.location.href="PC端网址"
   }
  }catch(e){}
 }
 }
}
</script>
<script type="text/javascript"> 
<!-- 
  //平台、设备和操作系统 
  var system = { 
   win: false, 
   mac: false, 
   xll: false, 
   ipad:false
  }; 
  //检测平台 
  var p = navigator.platform; 
  system.win = p.indexOf("Win") == 0; 
  system.mac = p.indexOf("Mac") == 0; 
  system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); 
  system.ipad = (navigator.userAgent.match(/iPad/i) != null)?true:false; 
  //跳转语句，如果是手机访问就自动跳转到手机端网页
  if (system.win || system.mac || system.xll||system.ipad) { 
  } else { 
   window.location.href = "PC网页"; 
  } 
--> 
</script>

JS 判断浏览器客户端类型(ipad,iphone,android)  

<script type="text/javascript">  
 var bForcepc = fGetQuery("dv") == "pc"; 
 function fBrowserRedirect(){ 
  var sUserAgent = navigator.userAgent.toLowerCase(); 
  var bIsIpad = sUserAgent.match(/ipad/i) == "ipad"; 
  var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os"; 
  var bIsMidp = sUserAgent.match(/midp/i) == "midp"; 
  var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4"; 
  var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb"; 
  var bIsAndroid = sUserAgent.match(/android/i) == "android"; 
  var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce"; 
  var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile"; 
  if(bIsIpad){ 
   var sUrl = location.href;  
   if(!bForcepc){ 
    window.location.href = "手机网址"; 
   } 
  } 
  if(bIsIphoneOs || bIsAndroid){ 
   var sUrl = location.href;  
   if(!bForcepc){ 
    window.location.href = "手机网址"; 
   } 
  } 
  if(bIsMidp||bIsUc7||bIsUc||bIsCE||bIsWM){ 
   var sUrl = location.href;  
   if(!bForcepc){ 
    window.location.href = ""; 
   } 
  } 
 } 
 function fGetQuery(name){//获取参数值 
  var sUrl = window.location.search.substr(1); 
  var r = sUrl.match(new RegExp("(^|&)" + name + "=([^&]*)(&|$)")); 
  return (r == null ? null : (r[2])); 
 } 
 function fShowVerBlock(){  
  if(bForcepc){ 
   document.getElementByIdx_x("dv_block").style.display = "block"; 
  } 
  else{ 
   document.getElementByIdx_x("ad_block").style.display = "block"; 
  } 
 } 
 fBrowserRedirect(); 
 </script>

测试是什么终端 

var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
alert('是否是Android：'+isAndroid);
alert('是否是iOS：'+isiOS); 

参考网址 

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/navigator

http://www.jb51.net/article/104661.htm

JS 判断是否是手机端并跳转操作的更多相关文章

  1. JS前端开发判断是否是手机端并跳转操作（小结）

    JS前端开发判断是否是手机端并跳转操作(小结) 这篇文章主要介绍了JS前端开发判断是否是手机端并跳转操作,非常不错,具有参考借鉴价值,需要的朋友可以参考下 常用跳转代码 ? 1 2 3 4 5 6 7 ...

  2. js判断是否为手机端访问

    随着移动端越来越重要,pc和移动端网站后台系统可能是同一个,登录或者某个特定时期需要根据不同访问来源,跳转不同页面或者做不同的处理: 这时我们就需要js的 navigator 对象: 我们先了解一下n ...

  3. js判断客户端是手机端还是PC端

    封装函数: function isPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Android", ...

  4. js 判断用户是手机端还是电脑端访问

    通过userAgent 判断,网页可以直接使用 navigation对象 node端 可以通过请求头的 ctx.request.header['user-agent'] const browser = ...

  5. PHP判断是否为手机端的方法

    PHP判断是否为手机端的方法 private function ismobile() { // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset($_SERVER['HT ...

  6. PHP 判断是否为手机端访问

    /* * 判断是否为手机端 */function check_wap(){ // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset ($_SERVER['HTTP_X_W ...

  7. javascript判断访问终端，手机端自动跳转

    在网页的顶部加入javascript判断代码: function checkserAgent(){ var userAgentInfo=navigator.userAgent; var userAge ...

  8. PHP判断用户是手机端？还是浏览器端访问？

    function isMobile(){ $useragent=isset($_SERVER['HTTP_USER_AGENT']) ? $_SERVER['HTTP_USER_AGENT'] : ' ...

  9. [js开源组件开发]-手机端照片预览组件

    手机端照片预览组件 可怜的我用着华为3C手机,用别人现成的组件都好卡,为了适应我这种屌丝,于是自己简化写了一版的照片预览效果,暂时无缩放功能,以后可能有空再加吧,你也可以自己加下,这是个github上 ...

随机推荐

  1. .NET Core微服务之路：基于gRPC服务发现与服务治理的方案

    重温最少化集群搭建,我相信很多朋友都已经搭建出来,基于Watch机制也实现了出来,相信也有很多朋友有了自己的实现思路,但是,很多朋友有个疑问,我API和服务分离好了,怎么通过服务中心进行发现呢,这个过 ...

  2. SQL Server PageIOLatch和PageLatch

    Latch是轻量级的锁,它是SQL Server内部用来同步资源访问的一个数据结构,使数据的访问同步有序,这意味着,当一个线程获得资源R的Latch的独占使用权时,如果其他的线程也想访问这个Latch ...

  3. 2018CCPC-女生专场

    (咕咕咕,咕了快一年的bu题.. A.CCPC直播 传送:http://acm.hdu.edu.cn/showproblem.php?pid=6297 题意:rt. 分析:模拟. #include&l ...

  4. Android Studio在项目中添加assets资源目录

    第一步: 切换到"Project"视图,找到app --> src --> main目录 第二步: 右键点击main目录,New --> Directory -- ...

  5. web API简介(一)：API，Ajax和Fetch

    概述 今天逛MDN,无意中看到了web API简介,觉得挺有意思的,就认真读了一下. 下面是我在读的时候对感兴趣的东西的总结,供自己开发时参考,相信对其他人也有用. 什么是API API (Appli ...

  6. 多核CPU配合负载均衡可以这样用，为老板省点钱

    负载均衡作为一个处理高并发,大流量的访问的业务场景,已经几乎是常识性的知识了. 而本文的意义在于需求:由于大流量请求,导致服务无法正常响应,在不增加购买机器成本的场景下,如何提高服务器的业务处理能力? ...

  7. rest framework 尝鲜

    安装 pip install djangorestframework 新建项目 python manage.py startapp idcs 添加模型(models.py) class Idcs(mo ...

  8. jsp-9大内置对象简介

    产生背景 JSP引擎在调用JSP对应的jspServlet时,会传递或创建9个与web开发相关的对象供jspServlet使用.JSP技术的设计者为便于开发人员在编写JSP页面时获得这些web对象的引 ...

  9. Python——collections模块

    collections模块 collections模块在内置数据类型(dict.list.set.tuple)的基础上,还提供了几个额外的数据类型:ChainMap.Counter.deque.def ...

  10. SpringBoot初探(上传文件)

    学了Spring,SpringMVC,Mybatis这一套再来看SpringBoot,心里只有一句握草,好方便 这里对今天做的东西做个总结,然后在这之间先安利一个热部署的工具,叫spring-DevT ...