一、JS判斷客戶端類型
JS判斷客戶端是否是iOS或者Android手機移動端
通過判斷瀏覽器的userAgent，用正則來判斷手機是否是ios和Android客戶端。
核心代碼如下：
方法一：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/> 7 <meta name="format-detection"content="telephone=no"> 8 <title>判斷客戶端類型1</title> 9 </head> 10 <body> 11 <script type="text/javascript"> 12 var u = navigator.userAgent; 13 var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android終端 14 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端 15 if (isAndroid) { 16 alert('這是Android'); 17 } 18 if (isiOS) { 19 alert('這是IOS'); 20 } 21 </script> 22 </body> 23 </html>
方法二：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/> 7 <meta name="format-detection"content="telephone=no"> 8 <title>判斷客戶端類型2</title> 9 </head> 10 <body> 11 <script type="text/javascript"> 12 if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { 13 //alert(navigator.userAgent); 14 alert('這是IOS'); 15 } else if (/(Android)/i.test(navigator.userAgent)) { 16 //alert(navigator.userAgent); 17 alert('這是Android'); 18 } else { 19 alert('這是PC'); 20 }; 21 </script> 22 23 </body> 24 </html>
二、JS檢測是否在微信打開
使用js 可以通過 window.navigator.userAgent 來獲取瀏覽器的相關信息，那么我們也可以通過該方法來獲取微信內置瀏覽器的相關信息。根據關鍵字 MicroMessenger 來判斷是否是微信內置的瀏覽器。
代碼如下：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/> 7 <meta name="format-detection"content="telephone=no"> 8 <title>判斷是否在微信里打開</title> 9 <meta name="description" content=""> 10 <meta name="keywords" content=""> 11 <link href="" rel="stylesheet"> 12 </head> 13 <body> 14 <script type="text/javascript"> 15 function is_weixn(){ 16 var ua = navigator.userAgent.toLowerCase(); 17 if(ua.match(/MicroMessenger/i)=="micromessenger") { 18 alert('在微信里打開'); 19 } else { 20 alert('不在微信里打開'); 21 } 22 } 23 24 is_weixn(); 25 </script> 26 </body> 27 </html>
三、JS判斷操作系統類型
在通過Javascript實現客戶端和服務端的交互時，有時候需要對操作系統進行判斷，以便實現不同操作系統下的兼容性，比如：我們有一個網站， 在Windows下瀏覽效果良好，但是到了Linux下，由於許多特性不同，會造成在瀏覽上的細微差異，甚至會影響到良好的用戶體驗。這個時候我們就需要利用 Javascript對操作系統的類型以及某些特性進行判斷，分而治之，從而實現網站在跨平台瀏覽時候保持良好的用戶體驗。
下邊是對Windows、Mac、Linux、Unix擦作系統進行判斷的代碼：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/> 7 <meta name="format-detection"content="telephone=no"> 8 <title>判斷操作系統類型</title> 9 </head> 10 <body> 11 <script type="text/javascript"> 12 function detectOS() { 13 var sUserAgent = navigator.userAgent; 14 var isWin = (navigator.platform == "Win32") || (navigator.platform == "Windows"); 15 var isMac = (navigator.platform == "Mac68K") || (navigator.platform == "MacPPC") || (navigator.platform == "Macintosh") || (navigator.platform == "MacIntel"); 16 if (isMac) return "Mac"; 17 var isUnix = (navigator.platform == "X11") && !isWin && !isMac; 18 if (isUnix) return "Unix"; 19 var isLinux = (String(navigator.platform).indexOf("Linux") > -1); 20 if (isLinux) return "Linux"; 21 if (isWin) { 22 var isWin2K = sUserAgent.indexOf("Windows NT 5.0") > -1 || sUserAgent.indexOf("Windows 2000") > -1; 23 if (isWin2K) return "Win2000"; 24 var isWinXP = sUserAgent.indexOf("Windows NT 5.1") > -1 || sUserAgent.indexOf("Windows XP") > -1; 25 if (isWinXP) return "WinXP"; 26 var isWin2003 = sUserAgent.indexOf("Windows NT 5.2") > -1 || sUserAgent.indexOf("Windows 2003") > -1; 27 if (isWin2003) return "Win2003"; 28 var isWinVista= sUserAgent.indexOf("Windows NT 6.0") > -1 || sUserAgent.indexOf("Windows Vista") > -1; 29 if (isWinVista) return "WinVista"; 30 var isWin7 = sUserAgent.indexOf("Windows NT 6.1") > -1 || sUserAgent.indexOf("Windows 7") > -1; 31 if (isWin7) return "Win7"; 32 } 33 return "other"; 34 } 35 36 alert("您的操作系統是：" + detectOS()); 37 </script> 38 </body> 39 </html>