使用JS判断客户端、浏览器、操作系统类型

一、JS判断客户端类型

JS判断客户端是否是iOS或者Android手机移动端

通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端。

核心代码如下:

方法一:

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终端
if (isAndroid) {
  alert('这是Android');
}
if (isiOS) {
  alert('这是IOS');
}

扫码体验:

方法二:

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
  //alert(navigator.userAgent);
  alert('这是IOS');
} else if (/(Android)/i.test(navigator.userAgent)) {
  //alert(navigator.userAgent);
  alert('这是Android');
} else {
  alert('这是PC');
};

扫码体验:

二、JS检测是否在微信打开

使用js 可以通过 window.navigator.userAgent 来获取浏览器的相关信息,那么我们也可以通过该方法来获取微信内置浏览器的相关信息。根据关键字 MicroMessenger 来判断是否是微信内置的浏览器。

核心代码如下:

function is_weixn(){
  var ua = navigator.userAgent.toLowerCase();
  if(ua.match(/MicroMessenger/i)=='micromessenger') {
    alert('在微信里打开');
  } else {
     alert('不在微信里打开');
  }
}
is_weixn();

扫码体验:

三、JS判断操作系统类型

在通过Javascript实现客户端和服务端的交互时,有时候需要对操作系统进行判断,以便实现不同操作系统下的兼容性,比如:我们有一个网站, 在Windows下浏览效果良好,但是到了Linux下,由于许多特性不同,会造成在浏览上的细微差异,甚至会影响到良好的用户体验。这个时候我们就需要利用 Javascript对操作系统的类型以及某些特性进行判断,分而治之,从而实现网站在跨平台浏览时候保持良好的用户体验。

下边是对Windows、Mac、Linux、Unix擦作系统进行判断的JS核心代码:

function detectOS() {
  var sUserAgent = navigator.userAgent;
  var isWin = (navigator.platform == "Win32") || (navigator.platform == "Windows");
  var isMac = (navigator.platform == "Mac68K") || (navigator.platform == "MacPPC") || (navigator.platform == "Macintosh") || (navigator.platform == "MacIntel");
  if (isMac) return "Mac";
  var isUnix = (navigator.platform == "X11") && !isWin && !isMac;
  if (isUnix) return "Unix";
  var isLinux = (String(navigator.platform).indexOf("Linux") > -1);
  if (isLinux) return "Linux";
  if (isWin) {
    var isWin2K = sUserAgent.indexOf("Windows NT 5.0") > -1 ||sUserAgent.indexOf("Windows 2000") > -1;
    if (isWin2K) return "Win2000";
    var isWinXP = sUserAgent.indexOf("Windows NT 5.1") > -1 || sUserAgent.indexOf("Windows XP") > -1;
    if (isWinXP) return "WinXP";
    var isWin2003 = sUserAgent.indexOf("Windows NT 5.2") > -1 || sUserAgent.indexOf("Windows 2003") > -1;
    if (isWin2003) return "Win2003";
    var isWinVista= sUserAgent.indexOf("Windows NT 6.0") > -1 || sUserAgent.indexOf("Windows Vista") > -1;
    if (isWinVista) return "WinVista";
    var isWin7 = sUserAgent.indexOf("Windows NT 6.1") > -1 || sUserAgent.indexOf("Windows 7") > -1;
    if (isWin7) return "Win7";
  }
   return "other";
}

alert("您的操作系统是:" + detectOS());

H5案例分享:使用JS判断客户端、浏览器、操作系统类型的更多相关文章

  1. 通过JS判断当前浏览器的类型

    通过JS判断当前浏览器的类型,对主流浏览器Chrome.Edge.Firefox.UC浏览器.QQ浏览器.360浏览器.搜狗浏览器的userAgent属性值来判断用户使用的是什么浏览器. 不同浏览器的 ...

  2. js判断手机浏览器操作系统和微信浏览器的方法

    做手机端的前端开发,少不了对手机平台的判断.如,对于app下载,就要判断在Android平台下就显示Android下载提示:在iOS平台下就显示iOS下载提示. 今天就为大家介绍一下用js判断手机客户 ...

  3. H5案例分享:JS手势框架 —— Hammer.js

    JS手势框架 -- Hammer.js 一.hammer.js简介 hammerJS是一个开源的,轻量级的触屏设备javascript手势库,它可以在不需要依赖其他东西的情况下识别触摸,鼠标事件.允许 ...

  4. js 判断客户端浏览器

    var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; return { ...

  5. js判断当前浏览器语言类型

    console.log(window.navigator.language.slice(0, 2)); 得到的是zh

  6. JS判断客户端、浏览器、操作系统

    一.JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端. 方法一: var u = navigator.us ...

  7. JS判断浏览器类型,JS判断客户端操作系统

    JS判断浏览器类型 function judge(){ var browser = { versions: function() { var u = navigator.userAgent, app ...

  8. 使用JS判断客户端、浏览器、操作系统类型

    一.JS判断客户端类型 JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端. 核心代码如下: 方法一: &l ...

  9. JS判断客户端是否是iOS或者Android或者ipad(三)

     *  * @function: 判断浏览器类型是否是Safari.Firefox.ie.chrome浏览器  * @return: true或false  *  */ function isSafa ...

随机推荐

  1. JavaScript数组:增删改查、排序等

    直接上代码 // 数组应用 var peoples = ["Jack","Tom","William","Tod",&q ...

  2. ubuntu系统升级记录

    之前在openstack中安装了ubuntu 12.04虚拟机,版本较低,需要升级为高版本.下面分享下升级过程: ubuntu系统升级操作:$ cat /etc/issueUbuntu 12.04.5 ...

  3. 10个CSS简写及优化技巧

    CSS简写就是指将多行的CSS属性简写成一行,又称为CSS代码优化或CSS缩写.CSS简写的最大好处就是能够显著减少CSS文件的大小,优化网站整体性能,更加容易阅读. 下面介绍常见的CSS简写规则: ...

  4. onselectstart与onselect

    这两个事件看起来很相似,事实上却非常的不同. onselectstart onselectstart几乎可以用于所有对象,其触发时间为目标对象被开始选中时(即选中动作刚开始,尚未实质性被选中).该事件 ...

  5. JSP基础学习

    JQuery教程: http://www.w3school.com.cn/jquery/ HTTP协议的 http://www.w3.org/Protocols/rfc2616/rfc2616.htm ...

  6. 前端代码目录结构、常用 piugin、元素补充用法及其它注意事项

    目录结构: app:  .html文件 css: .css文件 script: 脚本文件 plugin: 插件  (此目录放一些通用代码) 注意事项: 1.在IE浏览器下img会显示边框,为了保证兼容 ...

  7. 利用python合并两个文件

    1格式如下 在做利用zabbix的api来批量添加主机的时候,需要处理ip和hostname,在借用别人写的py程序的基础上,自己有改装了以下脚本,为自己使用.需要时ip和hostname为一个统一格 ...

  8. Asp.Net MVC<九>:OWIN,关于StartUp.cs

    https://msdn.microsoft.com/zh-cn/magazine/dn451439.aspx(Katana 项目入门) 一不小心写了个WEB服务器 快刀斩乱麻之 Katana OWI ...

  9. wcf测试证书的创建

    如何创建证书: makecert.exe -sr LocalMachine -ss My -a sha1 -n CN=JiangServer -sky exchange -pe     (服务端证书) ...

  10. ListView的联动实现

    情景: ListView中,如果业务需要在点击position为1的item是,将position=1的itemView背景设置为Green:其他的设置为white 如何实现? 实现方案: 通过onI ...