首先接到这个任务时感觉很懵。首先让我们梦回2016。
然而公司竟然还有人用IE11以下的版本。你说神奇不神奇?
看了好几篇文章,搜了好多代码。下面进入正题:
原始代码放入public/index.html的< head>中:
<script type="text/javascript">
(function(window) {
var theUA = window.navigator.userAgent.toLowerCase();
if ((theUA.match(/msie\s\d+/) && theUA.match(/msie\s\d+/)[0]) || (theUA.match(/trident\s?\d+/) && theUA.match(/trident\s?\d+/)[0])) {
var ieVersion = theUA.match(/msie\s\d+/)[0].match(/\d+/)[0] || theUA.match(/trident\s?\d+/)[0];
if (ieVersion < 11) {
var str = "你的浏览器版本太low了,已经和时代脱轨了 :(";
var str2 = "推荐使用:<a href='https://www.baidu.com/s?ie=UTF-8&wd=%E8%B0%B7%E6%AD%8C%E6%B5%8F%E8%A7%88%E5%99%A8' target='_blank' style='color:blue;'>谷歌</a>,"
+ "<a href='https://www.baidu.com/s?ie=UTF-8&wd=%E7%81%AB%E7%8B%90%E6%B5%8F%E8%A7%88%E5%99%A8' target='_blank' style='color:blue;'>火狐</a>,"
+ "其他双核极速模式";
document.writeln("<pre style='text-align:center;color:#fff;background-color:#0cc; height:100%;border:0;position:fixed;top:0;left:0;width:100%;z-index:1234'>" +
"<h2 style='padding-top:200px;margin:0'><strong>" + str + "<br/></strong></h2><h2>" +
str2 + "</h2><h2 style='margin:0'><strong>如果你的使用的是双核浏览器,请切换到极速模式访问<br/></strong></h2></pre>");
document.execCommand("Stop");
};
}
})(window);
</script>
这里navigator.userAgent为获取浏览器信息,toLowerCase()把所有字符串改为小写。下面的判定条件看不懂了,而且代码不起作用,后面加入else后可以进入else。所以做了以下改动。
<script type="text/javascript">
(function(window) {
var theUA = window.navigator.userAgent.toLowerCase();
console.log(theUA);
if (
// theUA.indexOf('trident') > -1 && theUA.indexOf('rv:11.0') > -1
theUA.indexOf("compatible") > -1 && theUA.indexOf("msie") > -1
) {
var str = "你的浏览器版本不受支持,请及时更新";
var str2 = "推荐使用:<a style='color:#fff;'>谷歌</a>,"
+ "<a style='color:#fff;'>搜狗</a>,"
+ "其他双核极速模式";
document.writeln("<pre style='text-align:center;color:#fff;background-color:#1890FF; height:100%;border:0;position:fixed;top:0;left:0;width:100%;z-index:1234'>" +
"<h2 style='padding-top:200px;margin:0'><strong>" + str + "<br/></strong></h2><h2>" +
str2 + "");
console.log("浏览器不合格")
document.execCommand("Stop");
}
else{
console.log("浏览器合格")
}
})(window);
</script>
代码主要对if中的判定条件做了改动,theUA.indexOf(‘trident’) > -1 && theUA.indexOf(‘rv:11.0’) > -1, 判定为是否为IE11,
theUA.indexOf(“compatible”) > -1 && theUA.indexOf(“msie”) > -1, 判断为是否为ie11以下版本。另外可输出console.log
查看浏览器信息。
博客中还有其他完成代码,暂不涉及