一、JS判断客户端类型

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

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

核心代码如下：

方法一：

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

 <meta name="format-detection"content="telephone=no">

 <title>判断客户端类型1</title>

 </head>

 <body>

     <script type="text/javascript">

         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');

         }

     </script>

 </body>

 </html>

方法二：

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

 <meta name="format-detection"content="telephone=no">

 <title>判断客户端类型2</title>

 </head>

 <body>

     <script type="text/javascript">

         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');

         };

     </script>

 </body>

 </html>

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

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

代码如下：

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

 <meta name="format-detection"content="telephone=no">

 <title>判断是否在微信里打开</title>

 <meta name="description" content="">

 <meta name="keywords" content="">

 <link href="" rel="stylesheet">

 </head>

 <body>

     <script type="text/javascript">

         function is_weixn(){

             var ua = navigator.userAgent.toLowerCase();

             if(ua.match(/MicroMessenger/i)=="micromessenger") {

                 alert('在微信里打开');

             } else {

                 alert('不在微信里打开');

             }

         }

        is_weixn();

     </script>

 </body>

 </html>

三、JS判断操作系统类型

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

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

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

 <meta name="format-detection"content="telephone=no">

 <title>判断操作系统类型</title>

 </head>

 <body>

     <script type="text/javascript">

         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());

     </script>

 </body>

 </html>

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

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

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

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

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

  3. js 判断客户端浏览器

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

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

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

  5. H5案例分享：使用JS判断客户端、浏览器、操作系统类型

    使用JS判断客户端.浏览器.操作系统类型 一.JS判断客户端类型 JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Androi ...

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

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

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

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

  8. JS判断访问设备(userAgent)加载不同页面 JS判断客户端操作系统类型(platform)

    //平台.设备和操作系统 var system ={ win : false, mac : false, xll : false }; //检测平台 var p = navigator.platfor ...

  9. js 判断客户端 和 asp.net/C#判断客户端类型

    1.js 判断客户端 <script language="JavaScript"> <!-- onload = function browserRedirect( ...

随机推荐

  1. 吴恩达机器学习笔记（七） —— K-means算法

    主要内容: 一.K-means算法简介 二.算法过程 三.随机初始化 四.二分K-means 四.K的选择 一.K-means算法简介 1.K-means算法是一种无监督学习算法.所谓无监督式学习,就 ...

  2. Contiki 2.7 Makefile 文件（五）

    4.第四部分 (1) oname = ${patsubst %.c,%.o,${patsubst %.S,%.o,$(1)}} 自定义函数,$(1)表示调用oname这个函数的第一个参数,patsub ...

  3. PYTHON 爬虫笔记六:PyQuery库基础用法

    知识点一:PyQuery库详解及其基本使用 初始化 字符串初始化 html = ''' <div> <ul> <li class="item-0"&g ...

  4. POJ-3680：Intervals （费用流）

    You are given N weighted open intervals. The ith interval covers (ai, bi) and weighs wi. Your task i ...

  5. 【Lintcode】070.Binary Tree Level Order Traversal II

    题目: Given a binary tree, return the bottom-up level order traversal of its nodes' values. (ie, from ...

  6. 【Python】数组排序

    1.numpy库:argsort() argsort函数返回的是数组值从小到大的索引值(升序排列) 一维: In [1]: import numpy as np In [2]: x = np.arra ...

  7. vue之axios请求数据本地json

    写给自己的话:静态的json文件要记得放在static文件夹下,想打自己 1.下载插件 npm install axios --save 2.在main.js下引用axios import axios ...

  8. 如何加快建 index 索引 的时间

    朋友在500w的表上建索引,半个小时都没有结束.所以就讨论如何提速. 一．先来看一下创建索引要做哪些操作:1. 把index key的data 读到内存==>如果data 没在db_cache ...

  9. 推荐几个Laravel 后台管理系统

    小编推荐几个Laravel 后台管理系统 由百牛信息技术bainiu.ltd整理发布于博客园 一.不容错过的Laravel后台管理扩展包 —— Voyager 简介Voyager是一个你不容错过的La ...

  10. 【转】Pro Android学习笔记（二）：开发环境：基础概念、连接真实设备、生命周期

    在Android学习笔记(二):安装环境中已经有相应的内容.看看何为新.这是在source网站上的Android架构图,和标准图没有区别,只是这张图颜色好看多了,录之.本笔记主要讲述Android开发 ...