判断是否 IE 浏览器及版本主要是三种方法, 第一种是通过 if IE 条件注释语句, 第二种是通过 @cc_on 条件编译结合 document.documentMode 属性来判断, 第三种则是简单粗暴地通过 JS 语句判断 navigator.userAgent 字符串.
一, 通过 if IE 条件注释判断
优点: 注释语句仅在 IE 浏览器执行, 代码简单
缺点: 仅支持到 IE9, 不支持 IE10 和 IE11
用法:
- [html] view plain copy
- <!--[if IE]>你正在使用的是 IE 浏览器<![endif]-->
- [html] view plain copy
- <!--[if IE 6]>你使用的是 IE6 浏览器, 这是 IE 的过期版本, 是时候升级了!<![endif]-->
- [html] view plain copy
- <!--[if lte IE 9]>这段文字只会在 IE9 及 (IE8/IE7/IE6/IE5 等) 以下版本显示<![endif]-->
- [html] view plain copy
- <!--[if gte IE 8]>这段文字只会在 IE8 及 (IE9) 以上版本显示<![endif]-->
二, 通过 @cc_on 条件编译和 documentMode 属性判断
优点: 可以判断 IE 的客户端版本(不受文档模式的影响), 支持 IE10
缺点: 不支持 IE11
用法:
/*@cc_on @*/ 中的代码只会 IE10 以及更低版本 IE 中有效, 其中有一个 @_jscript_version 变量是当前的 IE 的脚本版本, 但版本号没有规律, 下面的例子中可以看到不同 IE 版本对应版本号.
- [html] view plain copy
- <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 去规定.
- [html] view plain copy
- <script>
- if (!! document.documentMode) {
- alert('当前浏览器是 IE 且版本介于 8/9/10/11 之间, 文档模式是:' + document.documentMode);
- // 注意, 虽然 documentMode 是 IE8 才开始有, 但是 documentMode 最低可以是 7 是 5, 因为可以模拟低版本
- } else {
- alert('当前 IE 版本低于 IE8, 或不是 IE');
- }
- </script>
以文档模式为准判断 IE 浏览器版本:
- [html] view plain copy
- <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 浏览器版本:
- [html] view plain copy
- <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 条件编译语句实现)
- [html] view plain copy
- <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 条件注释语句实现)
- [html] view plain copy
- <!--[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 条件注释语句实现)
- [html] view plain copy
- <!--[if lte IE 8]><script>window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);</script><![endif]-->
来源: https://www.2cto.com/kf/201806/753955.html