首页 前端知识 js判断IE浏览器版本IE6,IE7,IE8,IE9,IE10,IE11

js判断IE浏览器版本IE6,IE7,IE8,IE9,IE10,IE11

2023-05-14 16:05:30 前端知识 前端哥 303 771 我要收藏

前端开发中常常会和IE打交道,本文将介绍如何使用JavaScript来判断IE浏览器的每个版本,包括IE11、IE10、IE9、IE8、IE7、IE6等更旧浏览器,并且还可以叠加,如IE10及以下,IE8及以下,IE6及以下,IE11或者非IE浏览器。

建议一般来说,我们是建议使用条件注释来替换浏览器检测的方法。本文所讲的技术仅仅在条件注释无法实现,或者需要检测一个bug。 IE条件注释:

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]--><!--[if IE 7 ]>    <html class="ie7"> <![endif]--><!--[if IE 8 ]>    <html class="ie8"> <![endif]--><!--[if IE 9 ]>    <html class="ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html class=""> <!--<![endif]-->

IE10及其以下的浏览器可以通过检测存在非标准的 document.all 对象来区分。 除了上面的特性外,每个IE浏览器还有各自的支持对象

IE版本支持的标准对象
10 window.atob
9 document.addEventListener
8 document.querySelector
7 window.XMLHttpRequest
6 document.compatMode通过上面列出的这些不同IE浏览器版本的检测特性,我们可以组合得到某个特定的IE版本 例如下面的这些组合
IE版本支持的状态
10及以下document.all
9及以下document.all && !window.atob
8及以下document.all && !document.addEventListener
7及以下document.all && !document.querySelector
6及以下document.all && !window.XMLHttpRequest
5.xdocument.all && !document.compatMode

例子下面的条件代码只会在IE7及一下浏览器中运行

if (document.all && !document.querySelector) {alert('IE7 or lower');}

下面这一个只会运行在IE8中,并且不支持IE7或者IE9:

if (document.all && document.querySelector && !document.addEventListener) {alert('IE8');}

下面的条件代码当浏览器为IE11 或者非IE时为真

if (!document.all) {alert('IE11  or not IE');}

其他方法检测IE版本由于IE11并不再支持条件注释了 检测不同的IE版本对应不同的javascript引擎

IE版本109876
JavaScript引擎版本1095.85.75.6条件注释 例如下面的代码结合条件注释和JS代码: HTML代码:
<script>var ie = false;</script><!--[if lte IE 7]><script>ie = 7;</script><![endif]-->

在JavaScript文件中:

if (7 === ie) {alert('IE7 or lower');}

或者是:

var test = document.createElement('div');test.innerHTML = '<!--[if lte IE 7]>1<![endif]-->';if ('1' === test.innerHTML) {alert('IE7 or lower');}

相比较使用全局方法,这种方法可能就不优雅并且速度也不是很快。

更进一步还可以进一步将版本号提取成参数,就能生成一个通用的检测IE版本的函数了:(2017-12-16日修改函数代码)

var isIE = function(ver){	ver = ver || '';	var b = document.createElement('b')	b.innerHTML = '<!--[if IE '   ver   ']>1<![endif]-->'	return b.innerHTML === '1'}if(isIE(6)){    // IE 6}// ...if(isIE(9)){    // IE 9}

这样想检测哪个版本都毫无压力。但是,如果只想检测是不是IE,而不关心浏览器版本,那只需要在调用函数的时候,不传递参数即可。

var ie  = isIE()


alert('ie6:'   isIE(6)   'n'   'ie7:'   isIE(7)   'n'   'ie8:'   isIE(8)   'n'   'ie9:'   isIE(9)   'n'   'ie:'   isIE())

IE版本代码总结IE11或者非IE

if (!document.all) {alert('IE11  or not IE');}

IE10

if (document.all && document.addEventListener && window.atob) {alert('IE10');}

IE9

if (document.all && document.addEventListener && !window.atob) {alert('IE9');}

IE8上面已经给出

if (document.all && document.querySelector && !document.addEventListener) {alert('IE8');}

IE7

if (document.all && window.XMLHttpRequest && !document.querySelector) {alert('IE7');}

IE6

if (document.all && document.compatMode && !window.XMLHttpRequest) {alert('IE6');}

检测IE版本

var win = window;var doc = win.document;var input = doc.createElement ("input");var ie = (function (){//"!win.ActiveXObject" is evaluated to true in IE11if (win.ActiveXObject === undefined) return null;if (!win.XMLHttpRequest) return 6;if (!doc.querySelector) return 7;if (!doc.addEventListener) return 8;if (!win.atob) return 9;//"!doc.body.dataset" is faster but the body is null when the DOM is not//ready. Anyway, an input tag needs to be created to check if IE is being//emulatedif (!input.dataset) return 10;return 11;})();


转载请注明出处或者链接地址:https://www.qianduange.cn//article/55.html
评论
会员中心 联系我 留言建议 回顶部
复制成功!