判断浏览器版本是否ie8,ie9,ie10,ie11并提示升级

判断是否IE浏览器极其版本主要是三种方法，第一种是通过 if IE 条件注释语句，第二种是通过 @cc_on 条件编译结合 document.documentMode 属性来判断，第三种则是简单粗暴地通过 JS 语句判断 navigator.userAgent 字符串。

 

一、通过 if IE 条件注释判断

优点：注释语句仅在IE浏览器执行，代码简单

缺点：仅支持到IE9，不支持IE10和IE11

用法：

<!--[if IE]>你正在使用的是IE浏览器<![endif]-->

<!--[if IE 6]>你使用的是IE6浏览器，这是IE的过期版本，是时候升级了！<![endif]-->

<!--[if lte IE 9]>这段文字只会在IE9及（IE8/IE7/IE6/IE5等）以下版本显示<![endif]-->

<!--[if gte IE 8]>这段文字只会在IE8及（IE9）以上版本显示<![endif]-->

 

二、通过 @cc_on 条件编译和 documentMode 属性判断

优点：可以判断IE的客户端版本（不受文档模式的影响），支持IE10

缺点：不支持IE11

用法：

/*@cc_on @*/  中的代码只会IE10以及更低版本IE中有效，其中有一个 @_jscript_version 变量是当前的IE的脚本版本，但版本号没有规律，下面的例子中可以看到不同IE版本对应版本号。

<script>/*@cc_on alert("这个弹窗只会在IE5/6/7/8/9/10中弹出"); @*/</script>

documentMode 是IE8开始提供的一个属性，用来获取当前的文档模式。

文档模式决定了IE怎样渲染网页，即高版本可以模拟低版本，例如可以实现用户使用IE10访问时模拟IE8访问，网页开发者可以通过X-UA-Compatible去规定文档模式。

注意：IE浏览器会根据网页标签的规范程序去决定是否启用IE7兼容模式，所以，如果你想IE总是用最高内核来渲染网页就必须使用X-UA-Compatible去规定。

<script>
if (!! document.documentMode) {
    alert('当前浏览器是IE且版本介于8/9/10/11之间，文档模式是：' + document.documentMode);
    // 注意，虽然 documentMode 是IE8才开始有，但是documentMode最低可以是7是5，因为可以模拟低版本
} else {
    alert('当前IE版本低于IE8，或不是IE');
}
</script>

以文档模式为准判断IE浏览器版本：

<script>
    var iever = 0;
    var _jsver = 0;
    /*@cc_on
        _jsver = @_jscript_version;
    @*/
    if (_jsver == 0) {
        // IE11 或者不是 IE
        
        if (!!window.MSInputMethodContext && !!document.documentMode) {
            iever = 11;
        }
    } else {
        var docmode = document.documentMode;
        if (!! docmode && docmode > 5) {
            iever = docmode;
        } else if (_jsver == 5.7 && window.XMLHttpRequest) {
            iever = 7;
        } else if (_jsver == 5.6 || (_jsver == 5.7 && !window.XMLHttpRequest)) {
            iever = 6;
        } else {
            iever = 5;
        }
    }
    
    if (iever > 0) {
        alert("当前（以文档模式为准）IE版本是：" + iever);
    } else {
        alert("当前不是IE浏览器");
    }
</script>

以客户端版本为准判断IE浏览器版本：

<script>
    var iever = 0;
    var _jsver = 0;
    /*@cc_on
        _jsver = @_jscript_version;
    @*/
    if (_jsver == 0) {
        // IE11 或者不是 IE
        
        if (!!window.MSInputMethodContext && !!document.documentMode) {
            iever = 11;
        }
    } else {
        if (_jsver >= 9) {
            iever = _jsver;
        } else if (_jsver == 5.8) {
            iever = 8;
        } else if (_jsver == 5.7 && window.XMLHttpRequest) {
            iever = 7;
        } else if (_jsver == 5.6 || (_jsver == 5.7 && !window.XMLHttpRequest)) {
            iever = 6;
        } else {
            iever = 5;
        }
    }
    
    if (iever > 0) {
        alert("当前（以客户版本为准）IE版本是：" + iever);
    } else {
        alert("当前不是IE浏览器");
    }
</script>

决定用户看到的网页效果的是文档模式，所以一般提示浏览器升级是以文档模式为准。if IE 条件注释语句也是以文档模式为准，如果IE11的文档模式被设置为IE9，那么 if lte IE 9 也会生效。

 

 

三、通过 navigator.userAgent 字符串判断

UA字符串可以随意变动，这是不建议使用的方法，不作过多介绍。值得一提的是，IE11和旧版IE的UA特征不一样，IE10等旧版IE的特征 MSIE + 版本号，例如 MSIE 10.0 ，而IE11则是 Trident/7.0; rv:11.0 这样。

 

 

四、提示旧版IE用户升级浏览器

2014年微软已放弃对IE8等旧版IE的支持和安全性更新，2016年微软已放弃对IE10等旧版IE的支持和安全性更新，至今，只剩一个IE11引导用户向新一代浏览器Edge过渡。

IE10及更旧版提示升级（使用只有IE10和旧版IE才支持 @cc_on 条件编译语句实现）

<script>/*@cc_on window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); @*/</script>

IE9及更旧版提示升级（使用IE9和旧版IE支持 if IE 条件注释语句实现）

<!--[if lte IE 9]><script>window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);</script><![endif]-->

IE8及更旧版提示升级（使用IE9和旧版IE支持 if IE 条件注释语句实现）

<!--[if lte IE 8]><script>window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);</script><![endif]-->

 

参考资料：

if IE 条件注释语句官方文档链接：https://docs.microsoft.com/zh-cn/previous-versions/windows/internet-explorer/ie-developer/compatibility/ms537512(v=vs.85)

@cc_on 条件编译语句官方文档链接：https://docs.microsoft.com/en-us/scripting/javascript/reference/at-cc-on-statement-javascript

IE 各版本 UA 字符串示例：http://www.useragentstring.com/pages/useragentstring.php?name=Internet+Explorer