推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)


Posted in Javascript onDecember 13, 2015

判断是否IE浏览器用的是window.navigator.userAgent,跟踪这个信息,发现在开发环境,识别为IE10,但访问服务器则识别为IE11,但IE11的userAgent里是没有MSIE标志的,原因就是这个了。

把判断IE浏览器的方法改成如下就可以了。

function isIE() { //ie?
 if (!!window.ActiveXObject || "ActiveXObject" in window)
 return true;
 else
 return false;
 }

下面是一些分享,大家可以看下,很实用的分析解说

在很多时候,我们一般采用navigator.userAgent和正则表达来判断IE浏览器版本,下面介绍用IE浏览器中不同特性来判断IE浏览器

1 判断IE浏览器与非IE 浏览器

IE浏览器与非IE浏览器的区别是IE浏览器支持ActiveXObject,但是非IE浏览器不支持ActiveXObject。在IE11浏览器还没出现的时候我们判断IE和非IE经常是这么写的

function isIe(){
 return window.ActiveXObject ? true : false;
 }

但是在IE11中上面判断的返回的是false,我自己在IE11测试了下如下代码

alert(window.ActiveXObject);

alert(typeof window.ActiveXObject);

结果是

推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)

推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)

这是为什么呢?明明ActiveXObject是存在的,怎么就typeof的结果确实undefined。哪位知道结果的告诉我这是为什么呢?为神马?

微软上的官网说出了IE11的ActiveXObject的不同。http://msdn.microsoft.com/en-us/library/ie/dn423948%28v=vs.85%29.aspx。但是并没有解释typeof的原因。如果我们用下面的代码来检测是可以的

alert("ActiveXObject" in window)//在ie11下返回的是false

这是我又不明白了"ActiveXObject" in window返回的是true,为什么以前判断IE浏览器的代码在IE11中返回的是false?再次求大牛们给个解释。谢谢
下面就直接给出兼容IE11判断IE与非IE浏览器的方法。

function isIe(){
 return ("ActiveXObject" in window);
 }

注意前提条件是我们的程序代码中不要覆盖ActiveXObject,应该没有哪个程序这么做吧。呵呵。

2 判断IE6浏览器

从IE7开始IE是支持XMLHttpRequest对象的,唯独IE6是不支持的。根据这个特性和前面判断IE的函数isIe()我们就知道怎么判断IE6了吧。判断方法如下

function isIe6() {
 // ie6是不支持window.XMLHttpRequest的
 return isIe() && !window.XMLHttpRequest;
 }

3 判断IE7浏览器

因为从IE8开始是支持文档模式的,它支持document.documentMode。IE7是不支持的,但是IE7是支持XMLHttpRequest对象的。判断方法如下

function isIe7() {
 //只有IE8+才支持document.documentMode
 return isIe() && window.XMLHttpRequest && !document.documentMode;
 }

4 判断IE8浏览器

在从IE9开始,微软慢慢的靠近标准,我们把IE678称为非标准浏览器,IE9+与其他如chrome,firefox浏览器称为标准浏览器。两者的区别其中有一个是。大家测试下如下代码。返回的是什么

alert(-[1,]);//在IE678中打印的是NaN,但是在标准浏览器打印的是-1

那么我们就可以根据上面的区别来判断是IE8浏览器。方法如下

function isIe8(){
 // alert(!-[1,])//->IE678返回NaN 所以!NaN为true 标准浏览器返回-1 所以!-1为false
 return isIe() &&!-[1,]&&document.documentMode;
}

5 判断IE9、IE10、IE11浏览器

从IE8浏览器是支持JSON内置对象的,从IE10开始支持js的严格模式,关于JS中的严格模式请参考这篇文章https://3water.com/article/75037.htm

IE9+下alert(!-[1,])返回的是false,IE9+是支持addEventListener的,但是IE11浏览器中是不支持原来IE中独有的事件绑定attachEvent。根据这些区别我们就能区分出IE9、IE10、IE11浏览器了。

6 判断其他浏览器

/****来自曾经项目中封装的公共类函数***/
//检测函数
var check = function(r) {
 return r.test(navigator.userAgent.toLowerCase());
 };
var statics = {
 /**
 * 是否为webkit内核的浏览器
 */
 isWebkit : function() {
 return check(/webkit/);
 },
 /**
 * 是否为火狐浏览器
 */
 isFirefox : function() {
 return check(/firefox/);
 },
 /**
 * 是否为谷歌浏览器
 */
 isChrome : function() {
 return !statics.isOpera() && check(/chrome/);
 },
 /**
 * 是否为Opera浏览器
 */
 isOpera : function() {
 return check(/opr/);
 },
 /**
 * 检测是否为Safari浏览器
 */
 isSafari : function() {
 // google chrome浏览器中也包含了safari
 return !statics.isChrome() && !statics.isOpera() && check(/safari/);
 }
};

js如何判断IE浏览器的版本包括IE11

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="https://3water.com/" />
<title>三水点靠木</title>
<script type="text/javascript">
var userAgent = navigator.userAgent, 
rMsie = /(msie\s|trident.*rv:)([\w.]+)/, 
rFirefox = /(firefox)\/([\w.]+)/, 
rOpera = /(opera).+version\/([\w.]+)/, 
rChrome = /(chrome)\/([\w.]+)/, 
rSafari = /version\/([\w.]+).*(safari)/; 
var browser; 
var version; 
var ua = userAgent.toLowerCase(); 
function uaMatch(ua){ 
 var match = rMsie.exec(ua); 
 if(match != null){ 
 return { browser : "IE", version : match[2] || "0" }; 
 } 
 var match = rFirefox.exec(ua); 
 if (match != null) { 
 return { browser : match[1] || "", version : match[2] || "0" }; 
 } 
 var match = rOpera.exec(ua); 
 if (match != null) { 
 return { browser : match[1] || "", version : match[2] || "0" }; 
 } 
 var match = rChrome.exec(ua); 
 if (match != null) { 
 return { browser : match[1] || "", version : match[2] || "0" }; 
 } 
 var match = rSafari.exec(ua); 
 if (match != null) { 
 return { browser : match[2] || "", version : match[1] || "0" }; 
 } 
 if (match != null) { 
 return { browser : "", version : "0" }; 
 } 
} 
var browserMatch = uaMatch(userAgent.toLowerCase()); 
if (browserMatch.browser){ 
 browser = browserMatch.browser; 
 version = browserMatch.version; 
} 
document.write(browser+version);  
</script>
</script>
</head>
<body>
 
</body>
</html>

上面的代码实现了判断功能,下面介绍一下它的实现原理,希望能够给需要的朋友带来帮助。

先来看一段代码:

navigator.userAgent

IE11下的信息截图:

推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)

然后使用相应的正则表达式进行匹配。IE11和以前版本的浏览器还是有较大差别的,以前的版本,这个信息中包含msie,IE11中没有了,新增加trident,后面跟着浏览器的版本号码,这一点要特别注意一下。

Javascript 相关文章推荐
javascript一些实用技巧小结
Mar 18 Javascript
一个字符串反转函数可实现字符串倒序
Sep 15 Javascript
javascript轻量级库createjs使用Easel实现拖拽效果
Feb 19 Javascript
辨析JavaScript中的Undefined类型与null类型
May 26 Javascript
AngularJs 指令详解及示例代码
Sep 01 Javascript
JQuery EasyUI的一些常用组件
Jul 12 jQuery
Angularjs的键盘事件的绑定
Jul 27 Javascript
Vue组件和Route的生命周期实例详解
Feb 10 Javascript
vue项目中使用tinymce编辑器的步骤详解
Sep 11 Javascript
JS+CSS3实现的简易钟表效果示例
Apr 13 Javascript
后台使用freeMarker和前端使用vue的方法及遇到的问题
Jun 13 Javascript
vue-cli3.X快速创建项目的方法步骤
Nov 14 Javascript
JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)
Dec 13 #Javascript
javascript性能优化之DOM交互操作实例分析
Dec 12 #Javascript
JavaScript文档碎片操作实例分析
Dec 12 #Javascript
javascript性能优化之事件委托实例详解
Dec 12 #Javascript
jsonp跨域请求数据实现手机号码查询实例分析
Dec 12 #Javascript
jQuery Validate初步体验(二)
Dec 12 #Javascript
jQuery Validate初步体验(一)
Dec 12 #Javascript
You might like
初探PHP5
2006/10/09 PHP
php 在线打包_支持子目录
2008/06/28 PHP
关于Sphinx创建全文检索的索引介绍
2013/06/25 PHP
PHP简单数据库操作类实例【支持增删改查及链式操作】
2016/10/10 PHP
PHP receiveMail实现收邮件功能
2018/04/25 PHP
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
2008/08/14 Javascript
Firebug 字幕文件JSON地址获取代码
2009/10/28 Javascript
文本框获得焦点和失去焦点的判断代码
2012/03/18 Javascript
jquery入门——事件机制之事件中的冒泡现象示例解释
2020/09/12 Javascript
bootstrap data与jquery .data
2014/07/07 Javascript
JavaScript中的无阻塞加载性能优化方案
2014/10/10 Javascript
JavaScript控制图片加载完成后调用回调函数的方法
2015/03/20 Javascript
Node.js连接mongodb实例代码
2017/06/06 Javascript
AngularJS实现controller控制器间共享数据的方法示例
2017/10/30 Javascript
js设置随机切换背景图片的简单实例
2017/11/12 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
2018/01/18 Javascript
vue中实现移动端的scroll滚动方法
2018/03/03 Javascript
Vue实现底部侧边工具栏的实例代码
2018/09/03 Javascript
JS/HTML5游戏常用算法之碰撞检测 像素检测算法实例详解
2018/12/12 Javascript
vue把输入框的内容添加到页面的实例讲解
2019/11/11 Javascript
[40:03]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#1EHOME VS Archon
2016/03/02 DOTA
[53:13]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第三场 1月18日
2021/03/11 DOTA
Python中的魔法方法深入理解
2014/07/09 Python
Python实现的计算器功能示例
2018/04/26 Python
Python实现的堆排序算法示例
2018/04/29 Python
Django压缩静态文件的实现方法详析
2018/08/26 Python
python选取特定列 pandas iloc,loc,icol的使用详解(列切片及行切片)
2019/08/06 Python
Python中函数的返回值示例浅析
2019/08/28 Python
python实现批量文件重命名
2019/10/31 Python
TensorBoard 计算图的查看方式
2020/02/15 Python
详解三种方式实现平滑滚动页面到顶部的功能
2019/04/23 HTML / CSS
美国存储和组织商店:The Container Store
2017/08/16 全球购物
ALDO加拿大官网:加拿大女鞋品牌
2018/12/22 全球购物
大学系主任推荐信范文
2013/12/24 职场文书
公共艺术专业自荐信
2014/09/01 职场文书
七年级数学教学反思
2016/02/17 职场文书