使用js 判断当前运行环境实在浏览器还是在手机
转:
在跨平台,各种浏览器,移动设备兼容的时候,经常要根据设备、浏览器做特定调整,所以判断设备和浏览器的工作,经常会用到,这里做一下总结。
有关浏览器类型的信息都藏在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 判断当前运行环境实在浏览器还是在手机的更多相关文章
- NodeJs>------->>第二章:Node.js中交互式运行环境--------REL
第二章:Node.js中交互式运行环境--------REL 一:REPL运行环境概述 C:\Users\junliu>node > foo = 'bar' ; 'bar' > 二: ...
- js判断是否是在微信浏览器中打开
// js判断是否是在微信浏览器中打开 function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/Mi ...
- 【方法】JS判断当前页面环境:PC端/移动端,安卓/IOS,微信环境/QQ环境等等
[主要知识] 浏览器设备信息:navigator.userAgent(本文中主要用到知识) 浏览器版本信息:navigator.appVersion var ua = navigator.userAg ...
- js判断用户关闭页面或浏览器
<html><head><meta http-equiv="Content-Type" content="text/html; charse ...
- JS判断当前是否是IE浏览器,并返回时IE几?
原文参考: https://www.cnblogs.com/liuyanxia/p/5855760.html 具体代码示例: 这里返回的是:如果不是IE浏览器返回 -1 ,返回 7/8/9/10/11 ...
- JS判断Android、iOS或浏览器的多种方法(四种方法)
第一种:通过判断浏览器的userAgent,用正则来判断是否是ios和Android客户端. 代码如下: <script type="text/javascript"> ...
- js判断是否是用微信浏览器打开
有时候微信开发,需要根据使用的浏览器不同,来进行不同的处理. 下面的代码,可以判断是否使用的是微信浏览器. <!DOCTYPE HTML> <html lang="en&q ...
- JS 判断各种设备,各种浏览器
话不多说,直接看代码 1.区分Android.iphone.ipad: var ua = navigator.userAgent.toLowerCase(); if (/android|adr/gi. ...
- Vue.js 运行环境搭建详解(基于windows的手把手安装教学)及vue、node基础知识普及
Vue.js 是一套构建用户界面的渐进式框架.他自身不是一个全能框架——只聚焦于视图层.因此它非常容易学习,非常容易与其它库或已有项目整合.在与相关工具和支持库一起使用时,Vue.js 也能完美地驱动 ...
随机推荐
- Redis哨兵机制(sentinel)
1.简介: 1.是什么: Redis-Sentinel是Redis官方推荐的高可用(HA)方案,当用Reids 做master-slave高可用方案时,假如master宕机了,redis本身(包括它的 ...
- 代理-jdk动态代理
1.基于接口的实现,要jdk动态代理的类必须要实现一个接口: 2.中介类:实现了InvocationHandler,并重写这个接口的 方法(public Object invoke(Object pr ...
- 2018-3-5-安装-pip
title author date CreateTime categories 安装 pip lindexi 2018-3-5 19:4:4 +0800 2018-03-05 18:57:15 +08 ...
- redis 发布订阅(pub/sub )
- 重视项目排期,对dateline 有所敬畏
项目排期 = 个人任务完成 + 风险预估 + 意外情况 + 项目上下游依赖 个人任务完成 个人任务具体话 不要考虑私人情感,专注工作 风险预估 对可能出现的情况进行考虑 意外情况 对出现的意外情况提前 ...
- SQL 查询子句
SQL WHERE Clause(查询子句) WHERE 子句用于过滤记录. SQL WHERE 子句 WHERE子句用于提取满足指定标准的记录. SQL WHERE 语法 SELECT column ...
- vue2 开发环境部署 及 打包配置
一.脚手架工具(vue2 的脚手架工具是 vue-cli) 1.脚手架工具的安装 参考 : https://blog.csdn.net/wulala_hei/article/details/804 ...
- 杂项-笔记-VS:VS2019笔记
ylbtech-杂项-笔记-VS:VS2019笔记 1.返回顶部 1. http://www.ddooo.com/softdown/142335.htm 2. 2.返回顶部 3.返回顶部 4. ...
- delphi基础篇之数据类型
Object Pascal 数据类型 数据类型与定义变量 Object Pascal 语言的最大特点是对数据类型的要求非常严谨.传递给过程或函数的参数值必须与形参的类型一致.在Object ...
- csdn左侧个人栏目美化,css英文颜色大全,跑马灯效果,点击转到qq联系,点击转到发送邮件。
跑马灯效果: <a href="http://mmmmmm.me" target="_blank"><marquee><font ...