如果浏览器判断条件和无支持的语法写在一起,整个<script>标签内的内容都将失效,所以需要将判断条件单独写在一个<script>内。
通常我们会这么写
<script type="text/javascript">
//浏览器判断
var ua = window.navigator.userAgent;
if (ua.indexOf("MSIE") > -1 || ua.indexOf("Trident/7.0") > -1) {
alert('当前浏览器为兼容模式,可切换极速模式来提升您的操作浏览体验!')
}else{
let head = document.getElementsByTagName("head")[0];
let node = document.createElement("script");
node.type = "text/javascript";
node.async = false;
node.src = `/sys-config.js?update=${new Date().getTime()}`;
head.appendChild(node);
}
</script>
但是else内容中 node.src = `/sys-config.js?update=${new Date().getTime()}`;,字符不被ie浏览器支持,导致整个script都报错,弹窗也无法弹出,虽然从逻辑上来说不会走到else分支,但是ie内核可能是先解析所有代码再根据具体逻辑展示,再解析的时候就报错了导致整段不执行。改写成下列方式来避免弹窗无法弹出。
<script type="text/javascript">
//浏览器判断
var ua = window.navigator.userAgent;
if (ua.indexOf("MSIE") > -1 || ua.indexOf("Trident/7.0") > -1) {
alert('当前浏览器为兼容模式,可切换极速模式来提升您的操作浏览体验!')
}
</script>
<script type="text/javascript">
//避免ie的时候同时被解析报错 单独独立一个标签编写
let head = document.getElementsByTagName("head")[0];
let node = document.createElement("script");
node.type = "text/javascript";
node.async = false;
node.src = `/sys-config.js?update=${new Date().getTime()}`;
head.appendChild(node);
</script>