使用JS判断客户端、浏览器、操作系统类型
一、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判断客户端、浏览器、操作系统类型的更多相关文章
- 通过JS判断当前浏览器的类型
通过JS判断当前浏览器的类型,对主流浏览器Chrome.Edge.Firefox.UC浏览器.QQ浏览器.360浏览器.搜狗浏览器的userAgent属性值来判断用户使用的是什么浏览器. 不同浏览器的 ...
- js判断手机浏览器操作系统和微信浏览器的方法
做手机端的前端开发,少不了对手机平台的判断.如,对于app下载,就要判断在Android平台下就显示Android下载提示:在iOS平台下就显示iOS下载提示. 今天就为大家介绍一下用js判断手机客户 ...
- js 判断客户端浏览器
var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; return { ...
- js判断当前浏览器语言类型
console.log(window.navigator.language.slice(0, 2)); 得到的是zh
- H5案例分享:使用JS判断客户端、浏览器、操作系统类型
使用JS判断客户端.浏览器.操作系统类型 一.JS判断客户端类型 JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Androi ...
- JS判断浏览器类型,JS判断客户端操作系统
JS判断浏览器类型 function judge(){ var browser = { versions: function() { var u = navigator.userAgent, app ...
- JS判断客户端、浏览器、操作系统
一.JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端. 方法一: var u = navigator.us ...
- JS判断访问设备(userAgent)加载不同页面 JS判断客户端操作系统类型(platform)
//平台.设备和操作系统 var system ={ win : false, mac : false, xll : false }; //检测平台 var p = navigator.platfor ...
- js 判断客户端 和 asp.net/C#判断客户端类型
1.js 判断客户端 <script language="JavaScript"> <!-- onload = function browserRedirect( ...
随机推荐
- POJ3261 Milk Patterns —— 后缀数组 出现k次且可重叠的最长子串
题目链接:https://vjudge.net/problem/POJ-3261 Milk Patterns Time Limit: 5000MS Memory Limit: 65536K Tot ...
- ActiveMQ之点对点使用
package com.toov5.producer; import javax.jms.Connection; import javax.jms.JMSException; import javax ...
- 1 准备学习redis
首先,当然是搜索相关资料了 1 Redis 设计与实现 http://redisbook.com/ 2 Redis快速入门 http://www.yiibai.com/redis/redis_quic ...
- BZOJ 3709 [PA2014]Bohater:贪心【反过来考虑】
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3709 题意: 在一款电脑游戏中,你需要打败n只怪物(从1到n编号). 为了打败第i只怪物, ...
- 写个sleep玩玩
static void sig_when_weakup(int no){ printf("weakup weakup\n"); longjmp(buf, ); } void wea ...
- Linux Shell: 统计系统中占用Swap 的程序PID和占用大小
#!/bin/bash SUM=0 OVERALL=0 for DIR in `find /proc/ -maxdepth 1 -type d -regex "^/proc/[0-9]+& ...
- appium 特殊操作
一.触摸操作 1.driver.tap([坐标],持续点击时间) 除了定位到元素的点击外,也可以通过tab实现坐标的点击 driver.tap(driver.tap([(216,1776)], ...
- div靠右浮动案例
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- <十七>UML核心视图动态视图之时序图
一:时序图 --->时序图是用于描述按时间顺序排列的对象之间的交互模式. --->它按照参与交互的对象所具有的“生命线”和他们相互发送的消息来显示这些对象. --->时序图包含对象和 ...
- BZOJ3127:[USACO2013OPEN]Yin and Yang
浅谈树分治:https://www.cnblogs.com/AKMer/p/10014803.html 题目传送门:https://www.lydsy.com/JudgeOnline/problem. ...