做过前端开发的应该知道 IE 是最令码农头疼的浏览器。适应性不好先不说吧,自家浏览器的不同版本的差别还那么大,IE8及以下版本的浏览器不支持 html5,不支持 css3,甚至有些 JavaScript 还不支持!!!然而,IE 是自带在 Windows 操作系统的,不同 Windows 版本自带的 IE 版本也不一样,你装了系统就会带上 IE 浏览器,IE浏览器一般不会自动更新,不像其他浏览器你可以自己选择,而且你一般都会选择最新的。而且,不是每个网民都像前端码农一样知道 IE 的缺点,使用 Chrome 浏览器其实大部分是码农... 嗯,也就是你不得不考虑。我经常会发出感叹:就特么不能统一一下世界上的浏览器标准吗
!!!卒。不过,假如码农能不屈服于这么多的浏览器厂家,只用兼容性好的内容,相信可以加快前端开发的标准统一吧...
下面是我根据实践经验总结出来的,分别从 html、css、JavaScript 三个层面来判断浏览器是否 IE。注意,Edge浏览器不当做 IE,它其实还挺好用的。另外,IE10 问题也不多。
一、HTML 判断 IE
使用的是 IE 条件注释法
判断格式:
<!--[if arg1 IE arg2]><![endif]-->
其中,arg1的取值为:1)不写,但代表相等
2)lt,也就是“lower than”
3)lte,也就是“lower than or equal”
3)gt,也就是“greater than”
4)gte,也就是“greater than or equal”
arg2的取值是版本数字号,可以是 5, 6, 7, 8, 9,也可以不写。
注意:IE10及之后已经不支持这种格式写法。也就是<!--[if IE]><![endif]-->只能识别 IE9及以下版本。
你可以在标签中间写任何内容,只有版本对上了,才会被识别。
比如:
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->
<!--[if lt IE 7]>
<h4>IE7以下版本可识别</h4>
<![endif]-->
<!--[if gte IE 7]>
<script>
alert("IE7以及IE7以上版本可识别");
</script>
<![endif]-->
二、CSS 判断 IE
使用的是一种叫做 hack 的东西。除了上面说过的 IE 注释法可以让浏览器去选择哪个 css 文件之外,还有另外两种方法,分别是类内属性前缀法、选择器前缀法。
因为有一份更好的博客,所以就不写了...
可以访问:http://blog.youkuaiyun.com/freshlover/article/details/12132801
三、JavaScript 判断 IE
下面的函数亲测有效:
function getBrowserVersion() {
var userAgent = navigator.userAgent.toLowerCase();
if (userAgent.match(/msie ([\d.]+)/) != null) {
//ie6--ie9
uaMatch = userAgent.match(/msie ([\d.]+)/);
return 'IE' + uaMatch[1];
} else if (userAgent.match(/(trident)\/([\w.]+)/)) {
uaMatch = userAgent.match(/trident\/([\w.]+)/);
switch (uaMatch[1]) {
case "4.0":
return "IE8";
break;
case "5.0":
return "IE9";
break;
case "6.0":
return "IE10";
break;
case "7.0":
return "IE11";
break;
default:
return "undefined";
}
}
return "undefined";
}