<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
var ua=navigator.userAgent;
document.write(`<h1>${ua}</h1>`)
//win10->edge浏览器->f12->仿真->用户代理字符串->切换不同浏览器,观察userAgent字符串的内容:
//1、自己浏览器的名称、版本号包含位置?位置不确定
//2、是否包含其他浏览器的名称?有哪些?解决兼容性问题
//希望获得隐藏浏览器相同的待遇
//注意顺序
//IE ...MSIE8.0...
//Firefox ...Firefox/55.0...
//Chrome ...Gecko) Chrome/60.0.3112.113 Safari/537.36...
//OPR ...Chrome/60.0.3112.90 Safari/537.36 OPR/47.0.2631.80...
//Safari ...Safari/602.1
//Edge ...Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299...
//1、拿到浏览器名称 browser
var browser,version;
//若ua中包含IE,且不等于-1,说明一点是IE,且版本号为11
if(ua.indexOf("IE")!=-1){
browser="IE";
}
//否则 若ua中包含IE,且不等于-1,说明一点是IE
else if(ua.indexOf("Trident")!=-1){
browser="IE";version=11;
}
//否则 ua中包含Firefox,且不等于-1,说明一点是Firefox"
else if(ua.indexOf("Firefox")!=-1){
browser="Firefox";
}
//否则 ua中包含OPR,且不等于-1,说明一点是OPR
else if(ua.indexOf("OPR")!=-1){
browser="OPR";
}
//否则 ua中包含Chrome,且不等于-1,说明一点是Chrome
else if(ua.indexOf("Chrome")!=-1){
browser="Chrome";
}
//否则 ua中包含Safari,且不等于-1,说明一点是Safari
else if(ua.indexOf("Safari")!=-1){
browser="Safari";
}
document.write(`<h1>${browser}</h1>`)
//2、若还未确定版本号
if(version===undefined){
//进一步判断浏览器版本号
//先找到浏览器名称在ua中的位置
var i=ua.indexOf(browser)
//跳到版本号开始的位置:浏览器第一个字母的位置+浏览器名称的长度+1
i+=browser.length+1;
//截取ua中i位置后三位转为整数
version=parseInt(ua.slice(i,i+3));
}
document.write(`<h1>${version}</h1>`)
</script>
</body>
</html>
(day05-02)查看浏览器名称、版本号
最新推荐文章于 2022-11-23 21:55:29 发布