发表于： 2020-04-02 23:42:17
1 1550
今天完成的事情：今天学习了用js判断浏览器的方法
明天计划的事情：继续学习js的技巧以及写一些实际例子
遇到的问题：Angular的内容还是要多加理解以及需要更多的实际练习
收获：今天学习了一下js的浏览器判断技巧
比如判断是否微信浏览器
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>
JavaScript 判断是否在微信浏览器中打开。
</p>
<hr>
<script>
function is_weixn() {
var ua = navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == "micromessenger") {
return true;
} else {
return false;
}
}
if (is_weixn()) {
document.write("微信浏览器")
} else {
document.write("其他浏览器")
}
</script>
</body>
</html>
运行结果
在电脑端打开就不是微信浏览器
同理可以判断移动端浏览器还是 PC 端浏览器。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>
JavaScript 判断当期设备是移动端浏览器还是 PC 端浏览器。
</p>
<hr>
<hr>
<script>
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
document.write("移动")
} else {
document.write("PC")
}
</script>
</body>
</html>
运行结果
判断为pc
在精确一点可以判断浏览器的类型，例如
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var Browser = new Object();
Browser.isMozilla = (typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined') && (typeof HTMLDocument != 'undefined');
Browser.isIE = window.ActiveXObject ? true : false;
Browser.isFirefox = (navigator.userAgent.toLowerCase().indexOf("firefox") != -1);
Browser.isSafari = (navigator.userAgent.toLowerCase().indexOf("safari") != -1);
Browser.isOpera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
function check() {
alert(Browser.isIE ? 'ie' : 'not ie');
alert(Browser.isFirefox ? 'Firefox' : 'not Firefox');
alert(Browser.isSafari ? 'Safari' : 'not Safari');
alert(Browser.isOpera ? 'Opera' : 'not Opera');
}
window.onload = check;
</script>
</body>
</html>
运行结果
或者还有一种写法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
function myBrowser() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
if (userAgent.indexOf("Opera") > -1) {
return "Opera"
}; //判断是否Opera浏览器
if (userAgent.indexOf("Firefox") > -1) {
return "FF";
} //判断是否Firefox浏览器
if (userAgent.indexOf("Chrome") > -1) {
return "Chrome";
}
if (userAgent.indexOf("Safari") > -1) {
return "Safari";
} //判断是否Safari浏览器
if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
return "IE";
}; //判断是否IE浏览器
}
//以下是调用上面的函数
var nowBrowser = myBrowser();
if ("IE" == nowBrowser) {
alert("IE");
}
if ("FF" == nowBrowser) {
alert("Firefox");
}
if ("Chrome" == nowBrowser) {
alert("Chrome");
}
if ("Opera" == nowBrowser) {
alert("Opera");
}
if ("Safari" == nowBrowser) {
alert("Safari");
}
</script>
</body>
</html>
运行结果
直接判断处理是chrome
或者更简单一点
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function getOs() {
var OsObject = "";
if (isIE = navigator.userAgent.indexOf("MSIE") != -1) {
return "MSIE";
}
if (isFirefox = navigator.userAgent.indexOf("Firefox") != -1) {
return "Firefox";
}
if (isChrome = navigator.userAgent.indexOf("Chrome") != -1) {
return "Chrome";
}
if (isSafari = navigator.userAgent.indexOf("Safari") != -1) {
return "Safari";
}
if (isOpera = navigator.userAgent.indexOf("Opera") != -1) {
return "Opera";
}
}
alert("type -> " + getOs());
</script>
</body>
</html>
运行结果
明天继续看Angular的内容
返回列表
评论