js判断浏览器的环境(pc端,移动端,还是微信浏览器)


Posted in Javascript onDecember 24, 2020

今天突然看到一段很好的代码,分享给大家,顺便也给自己留个笔记,js判断浏览器的环境具体如下:

方法一:

// 判断浏览器函数
 function isMobile(){
  if(window.navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)) {
   return true; // 移动端
  }else{
   return false; // PC端
  }
 }

方法二:这个方法摘自:im.qq.com

var os = function() { 
  var ua = navigator.userAgent, 
  isWindowsPhone = /(?:Windows Phone)/.test(ua), 
  isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone, 
  isAndroid = /(?:Android)/.test(ua), 
  isFireFox = /(?:Firefox)/.test(ua), 
  isChrome = /(?:Chrome|CriOS)/.test(ua), 
  isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)), 
  isPhone = /(?:iPhone)/.test(ua) && !isTablet, 
  isPc = !isPhone && !isAndroid && !isSymbian; 
  return { 
   isTablet: isTablet, 
   isPhone: isPhone, 
   isAndroid : isAndroid, 
   isPc : isPc 
  }; 
}(); 
 
// 使用方法 
if(os.isAndroid || os.isPhone){
alert("-----");
}

判断是否为微信客户端:

代码1

window.isInWeixinApp = function() {
    return /MicroMessenger/.test(navigator.userAgent);
  };
/**
   * 判断是否是微信环境
   */
  function getIsWxClient () {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
      return true;
    }
    return false;
  };

代码2

var isWechart = function () {
  var rst = true
  if(window.navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)){
   var ua = navigator.userAgent.toLowerCase();
   if (!(ua.match(/MicroMessenger/i) == "micromessenger")) {
    rst = false;
   }
  }else {
   rst = false;
  }
  return rst;
 }

判断微信浏览器是PC端还是手机端,以及手机端是微信浏览器还是非微信浏览器

//平台、设备和操作系统 
   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) { 
    alert("在PC端上打开的");
   } else { 
    var ua = navigator.userAgent.toLowerCase(); 
    if(ua.match(/MicroMessenger/i)=="micromessenger") { 
     alert("在手机端微信上打开的"); 
    } else { 
     alert("在手机上非微信上打开的"); 
    } 
   }

js判断当前环境是否为app环境

/**
   *判断是否是app环境
   */
  function getIsApp () {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/isapp/i) == "isapp") {
      return true;
    }
    return false;
  };

js--判断当前环境是否为iphonex环境

/**
   *判断是否是app环境
   */
  function getIsApp () {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/isapp/i) == "isapp") {
      return true;
    }
    return false;
  };

js移动端页面判断是否是iphoneX

function isIPhoneX(fn){
  var u = navigator.userAgent;
  var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
  if (isIOS) {    
    if (screen.height == 812 && screen.width == 375){
      //是iphoneX
    }else{
      //不是iphoneX
    } 
  }
}

 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js两行代码按指定格式输出日期时间
Oct 21 Javascript
Js+php实现异步拖拽上传文件
Jun 23 Javascript
jQuery中$.each()函数的用法引申实例
May 12 Javascript
Vue.js实现无限加载与分页功能开发
Nov 03 Javascript
基于Node.js的WebSocket通信实现
Mar 11 Javascript
JS/jquery实现一个网页内同时调用多个倒计时的方法
Apr 27 jQuery
javascript 跨域问题以及解决办法
Jul 17 Javascript
JavaScript实现一个简易的计算器实例代码
May 10 Javascript
vue.js使用v-if实现显示与隐藏功能示例
Jul 06 Javascript
Ant Design Vue 添加区分中英文的长度校验功能
Jan 21 Javascript
利用JS判断元素是否为数组的方法示例
Jan 08 Javascript
ajax请求前端跨域问题原因及解决方案
Oct 16 Javascript
你可能从未使用过的11+个JavaScript特性(小结)
Jan 08 #Javascript
你知道JavaScript Symbol类型怎么用吗
Jan 08 #Javascript
js实现多个标题吸顶效果
Jan 08 #Javascript
Vue v-model组件封装(类似弹窗组件)
Jan 08 #Javascript
jquery实现吸顶导航效果
Jan 08 #jQuery
JS实现网站吸顶条
Jan 08 #Javascript
js实现移动端吸顶效果
Jan 08 #Javascript
You might like
PHP 截取字符串函数整理(支持gb2312和utf-8)
2010/02/16 PHP
浅析php创建者模式
2014/11/25 PHP
PHP实现生成推广海报的方法详解
2018/03/14 PHP
php/JS实现的生成随机密码(验证码)功能示例
2019/06/06 PHP
几行代码轻松搞定jquery实现flash8类似的连接效果
2007/05/03 Javascript
js函数排序的实例代码
2013/07/01 Javascript
jQuery中bind与live的用法及区别小结
2014/01/27 Javascript
兼容所有浏览器的js复制插件Zero使用介绍
2014/03/19 Javascript
jQuery中Ajax的get、post等方法详解
2015/01/20 Javascript
jQuery实用密码强度检测
2017/03/02 Javascript
BootStrap selectpicker后台动态绑定数据的方法
2017/07/28 Javascript
webpack4.x开发环境配置详解
2018/08/04 Javascript
jQuery-ui插件sortable实现自由拖动排序
2018/12/01 jQuery
使用layui实现树形结构的方法
2019/09/20 Javascript
Node登录权限验证token验证实现的方法示例
2020/05/25 Javascript
全面解析JavaScript Module模式
2020/07/24 Javascript
解决vue动态下拉菜单 有数据未反应的问题
2020/08/06 Javascript
利用js实现简易红绿灯
2020/10/15 Javascript
TensorFlow在MAC环境下的安装及环境搭建
2017/11/14 Python
python3利用Dlib19.7实现人脸68个特征点标定
2018/02/26 Python
python/sympy求解矩阵方程的方法
2018/11/08 Python
python3 pygame实现接小球游戏
2019/05/14 Python
浅谈Python中threading join和setDaemon用法及区别说明
2020/05/02 Python
Django框架请求生命周期实现原理
2020/11/13 Python
python 实现波浪滤镜特效
2020/12/02 Python
阿迪达斯印度官方商城:adidas India
2017/03/26 全球购物
医生实习工作总结的自我评价
2013/09/27 职场文书
大学毕业生通用求职信
2013/09/28 职场文书
幼儿园中秋节活动反思
2014/02/16 职场文书
水利水电建筑施工应届生求职信
2014/07/04 职场文书
租车协议书
2015/01/27 职场文书
我是特种兵观后感
2015/06/11 职场文书
教师素质教育心得体会
2016/01/19 职场文书
大学生村官驻村工作心得体会
2016/01/23 职场文书
七年级作文之秋游
2019/10/21 职场文书
OpenCV项目实践之停车场车位实时检测
2022/04/11 Python