转:

在跨平台,各种浏览器,移动设备兼容的时候,经常要根据设备、浏览器做特定调整,所以判断设备和浏览器的工作,经常会用到,这里做一下总结。

有关浏览器类型的信息都藏在USER-AGENT里面,首先读取navigator.userAgent里面的信息,为了方便利用toLowerCase方法转成小写的形式。然后用MATCH方法进行匹配版本信息,这里提供了多个版本的测试信息,可以用来做后续代码的接口。

1)     判断移动端设备,区分android,iphone,ipad和其它

var ua = navigator.userAgent.toLowerCase();
if(ua.match(/android/i)) == "android") {
alert("android");
}
if(ua.match(/iPhone/i)) == "iPhone") {
alert("iPhone");
}
if(ua.match(/iPad/i)) == "iPad") {
alert("iPad");
}
2)    判断移动端用的是不是特定类型的浏览器,比如新浪weibo客户端内置浏览器,qq客户端内置浏览器(而非qq浏览器),微信内置浏览器
(并且区分版本是否大于等于6.0.2)(特定类型浏览器可能会存在,无法下载,无法跳转和自己的客户端app的特定协议等等,所以需要区分)

(由于微信在6.0.2的时候做了新的策略,使得微信的分享功能在新版本变得不一样,为了兼容新旧版本,这里做了区分操作)

新浪weibo客户端返回1,qq客户端返回2,微信小于6.0.2版本返回3,微信大于等于6.0.2版本返回4,其它返回0

var ua = navigator.userAgent.toLowerCase();
if(ua.match(/weibo/i) == "weibo") {
return 1;
} else if(ua.indexOf('qq/') != -1) {
return 2;
} else if(ua.match(/MicroMessenger/i) == "micromessenger") {
var v_weixin = ua.split('micromessenger')[1];
v_weixin = v_weixin.substring(1, 6);
v_weixin = v_weixin.split(' ')[0];
if(v_weixin.split('.').length == 2) {
v_weixin = v_weixin + '.0';
}
if(v_weixin < '6.0.2') {
return 3;
} else {
return 4;
}
} else {
return 0;
}

3)最后,把他们统一起来判断登陆端是pc还是手机

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 || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
alert("您是手机登录");
} else {
alert("您是电脑登录");
}

---------------------
作者:H小志
来源:CSDN
原文:https://blog.csdn.net/xiaozhi_2016/article/details/52288556
版权声明:本文为博主原创文章,转载请附上博文链接!

使用js 判断当前运行环境实在浏览器还是在手机的更多相关文章

  1. NodeJs>------->>第二章:Node.js中交互式运行环境--------REL

    第二章:Node.js中交互式运行环境--------REL 一:REPL运行环境概述 C:\Users\junliu>node > foo = 'bar' ; 'bar' > 二: ...

  2. js判断是否是在微信浏览器中打开

    // js判断是否是在微信浏览器中打开 function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/Mi ...

  3. 【方法】JS判断当前页面环境:PC端/移动端,安卓/IOS,微信环境/QQ环境等等

    [主要知识] 浏览器设备信息:navigator.userAgent(本文中主要用到知识) 浏览器版本信息:navigator.appVersion var ua = navigator.userAg ...

  4. js判断用户关闭页面或浏览器

    <html><head><meta http-equiv="Content-Type" content="text/html; charse ...

  5. JS判断当前是否是IE浏览器,并返回时IE几?

    原文参考: https://www.cnblogs.com/liuyanxia/p/5855760.html 具体代码示例: 这里返回的是:如果不是IE浏览器返回 -1 ,返回 7/8/9/10/11 ...

  6. JS判断Android、iOS或浏览器的多种方法(四种方法)

    第一种:通过判断浏览器的userAgent,用正则来判断是否是ios和Android客户端. 代码如下: <script type="text/javascript"> ...

  7. js判断是否是用微信浏览器打开

    有时候微信开发,需要根据使用的浏览器不同,来进行不同的处理. 下面的代码,可以判断是否使用的是微信浏览器. <!DOCTYPE HTML> <html lang="en&q ...

  8. JS 判断各种设备,各种浏览器

    话不多说,直接看代码 1.区分Android.iphone.ipad: var ua = navigator.userAgent.toLowerCase(); if (/android|adr/gi. ...

  9. Vue.js 运行环境搭建详解(基于windows的手把手安装教学)及vue、node基础知识普及

    Vue.js 是一套构建用户界面的渐进式框架.他自身不是一个全能框架——只聚焦于视图层.因此它非常容易学习,非常容易与其它库或已有项目整合.在与相关工具和支持库一起使用时,Vue.js 也能完美地驱动 ...

随机推荐

  1. js canvas 粒子动画 电子表

     前言 从我接触canvas的第一天就觉得canvas很有趣,想搞点事情,这几天终于忍不住了,于是他来了. 先看效果                       这里我做了四个大家有兴趣可以看完文章, ...

  2. 使用vscode搭建本地的websocket

    首先在服务器方面,网上都有不同的对websocket支持的服务器: php - http://code.google.com/p/phpwebsocket/ jetty - http://jetty. ...

  3. Oracle 一个表的数据update到另一个表

    A表数据 B表数据         现在要把B表 B_COSTS 的值update到A表 A_COSTS 字段 SQL语法: update a set (a.a_costs) = (select b. ...

  4. springmvc基于注解的权限控制

    一.权限码 /** * @Title: AuthCode.java * @Package cn.com.kamfu.auth * @Description: TODO(用一句话描述该文件做什么) * ...

  5. 2016计蒜之道复赛 百度地图的实时路况 分治+Floyd

    题目链接:https://nanti.jisuanke.com/t/A1108 这道题还挺有意思的.让我对Floyd的了解又加深了一点. 首先我们重新审视Floyd这三重循环到底有什么用?第一层是枚举 ...

  6. 转帖:maven(二) maven项目构建ssh工程(父工程与子模块的拆分与聚合)

    出处:http://www.cnblogs.com/whgk/p/7121336.html 前一节我们明白了maven是个什么玩意,这一节就来讲讲他的一个重要的应用场景,也就是通过maven将一个ss ...

  7. 搭建appium+maven手机自动化测试环境搭建

    搭建安卓自动化测试框架记录: 需要的软件: jdk版本:jdk1.8 appium版本:v1.4.16 下载AppiumForWindows.zip (下载appium1.7不需要配置环境变量) no ...

  8. leetcode-163周赛-1260-二维网格迁移

    题目描述: 自己的提交: class Solution: def shiftGrid(self, grid: List[List[int]], k: int) -> List[List[int] ...

  9. springMVC配置文件 的约束

    <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.spr ...

  10. Delphi 2010 XE 中使用 JSON 之 SuperObject68-6

    JSON之SuperObject(1):一直盼着Delphi能够直接支持"正则:Delphi2009刚来的时候,有了JSON,但:Delphi2010带了两个相关单元:DBXJS:我想不等了 ...