JavaScript 判断浏览器是否是IE


Posted in Javascript onFebruary 19, 2021

作为一个前端,避免不了会遇见IE的坑,其他浏览器都好好的,测到IE就完蛋,各种不支持,服气了

有些属性和方法是所有版本IE都不支持,而有些则是部分支持,在项目中能够,主要分界岭为IE8,我相信目前大部分在维护和开发的项目,都是支持到IE8及已上版本即可,那么这篇文章,粗浅的总结一下,如何判断浏览器是IE及版本是8.0

首先,有些属性和方法是所有版本IE都不支持,那么只需要判断是否是IE即可

以下三种是我在项目中,用到的方法,如有新的方法,会更新,若大家有其他更好的方法,还望不吝赐教~~

  • document.all
  • window.ActiveXObject
  • window.navigator.msSaveOrOpenBlob
//选一种即可
function isIE(){
 // 据说火狐以后会加入document.all这个方法,所以建议使用另外二种方法
 if (document.all) return true; 
 
 if (!!window.ActiveXObject || "ActiveXObject" in window) return true; 
 
 if (window.navigator && window.navigator.msSaveOrOpenBlob) return true; 
}

判断浏览器是IE8及以下版本

我在上文中也提到,大部分在维护和开发的项目,都是支持到IE8及已上版本即可

navigator.userAgent

JavaScript 判断浏览器是否是IE

function isIE8(){
 var DEFAULT_VERSION = 8.0; 
 var ua = navigator.userAgent.toLowerCase(); 
 var isIE = ua.indexOf("msie")>-1; 
 var safariVersion; 
 if(isIE){ 
  safariVersion = ua.match(/msie ([\d.]+)/)[1]; 
 } 
 if(safariVersion <= DEFAULT_VERSION ){ 
  return true 
 };
}

如有特殊要求,需要兼容更低版本,那么:

var isIE = !!window.ActiveXObject; 

var isIE6 = isIE && !window.XMLHttpRequest; 

var isIE8 = isIE && !!document.documentMode; 

var isIE7 = isIE && !isIE6 && !isIE8;

IE8及以下不支持的CSS属性

  • 阴影 box-shadow
  • 渐变 linear-gradient
  • 提示符 placeholder
  • 透明度 rgba
  • 边框 border-image
  • 圆角 border-radius
  • 旋转相关 transform

IE不支持的方法

在线浏览PDF文件,因为IE并没有内置的pdf阅读器,因此只能下载查看

  • 后端返回文件流时:window.navigator.msSaveOrOpenBlob(blob);具体可以参考另两篇博文,
  • JavaScript处理后端返回PDF文件流,在线预览下载PDF文件
  • Vue.js +pdf.js 处理响应pdf文件流数据,前端转图片预览不可下载

不支持<a>标签的download属性,因此可以用新建iframe,并设置其src属性

if (isIE()){
	$("a").bind('click',function(){
		var elemIF = document.createElement("iframe"); 
		elemIF.src = FilePath;
		elemIF.style.display = "none"; 
		document.body.appendChild(elemIF);
	});
} else {
	$("a").attr("href",FilePath).attr("download",FileName);
}

以上就是JavaScript 判断浏览器是否是IE的详细内容,更多关于JavaScript 判断浏览器的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
JavaScript搜索字符串并将搜索结果返回到字符串的方法
Apr 06 Javascript
js实现文本框输入文字个数限制代码
Dec 25 Javascript
Bootstrap创建可折叠的组件
Feb 23 Javascript
jQuery+ajax实现滚动到页面底部自动加载图文列表效果(类似图片懒加载)
Jun 07 Javascript
浅谈JavaScript中的this指针和引用知识
Aug 05 Javascript
Angularjs2不同组件间的通信实例代码
May 06 Javascript
深入理解ES7的async/await的用法
Sep 09 Javascript
JavaScript中Object值合并方法详解
Dec 22 Javascript
KOA+egg.js集成kafka消息队列的示例
Nov 09 Javascript
vue实现扫码功能
Jan 17 Javascript
js与jquery获取input输入框中的值实例讲解
Feb 27 jQuery
el-form 多层级表单的实现示例
Sep 10 Javascript
原生JavaScript实现进度条
Feb 19 #Javascript
原生JavaScript实现换肤
Feb 19 #Javascript
基于vue的video播放器的实现示例
Feb 19 #Vue.js
JavaScript Dom实现轮播图原理和实例
Feb 19 #Javascript
JavaScript使用setTimeout实现倒计时效果
Feb 19 #Javascript
react项目从新建到部署的实现示例
Feb 19 #Javascript
原生JavaScript实现幻灯片效果
Feb 19 #Javascript
You might like
js下函数般调用正则的方法附代码
2008/06/22 PHP
php知道与问问的采集插件代码
2010/10/12 PHP
解决PhpMyAdmin中导入2M以上大文件限制的方法分享
2014/06/06 PHP
调用WordPress函数统计文章访问量及PHP原生计数器的实现
2016/03/21 PHP
Yii2中SqlDataProvider用法示例
2016/09/22 PHP
php封装的page分页类完整实例
2016/10/18 PHP
菜鸟javascript基础资料整理3 正则
2010/12/06 Javascript
浅析js中的浮点型运算问题
2014/01/06 Javascript
浅谈javascript中return语句
2015/07/15 Javascript
深入学习jQuery Validate表单验证(二)
2016/01/18 Javascript
深入解析jQuery中Deferred的deferred.promise()方法
2016/05/03 Javascript
如何判断Javascript对象是否存在的简单实例
2016/05/18 Javascript
js实现的光标位置工具函数示例
2016/10/03 Javascript
bootstrap fileinput组件整合Springmvc上传图片到本地磁盘
2017/05/11 Javascript
AngularJS中scope的绑定策略实例分析
2017/10/30 Javascript
浅析vue深复制
2018/01/29 Javascript
利用JS实现一个同Excel表现的智能填充算法
2018/08/13 Javascript
JS随机密码生成算法
2019/09/23 Javascript
详解vite+ts快速搭建vue3项目以及介绍相关特性
2021/02/25 Vue.js
Python 修改列表中的元素方法
2018/06/26 Python
python 获取url中的参数列表实例
2018/12/18 Python
Python SELENIUM上传文件或图片实现过程
2019/10/28 Python
python处理RSTP视频流过程解析
2020/01/11 Python
在Sublime Editor中配置Python环境的详细教程
2020/05/03 Python
Python中SQLite如何使用
2020/05/27 Python
python简单利用字典破解zip文件口令
2020/09/07 Python
英国最大的汽车配件在线商店:Euro Car Parts
2019/09/30 全球购物
施工安全标语
2014/06/07 职场文书
个人股份合作协议书
2014/10/24 职场文书
鲁迅故里导游词
2015/02/05 职场文书
和谐拯救危机观后感
2015/06/15 职场文书
小学毕业感言200字
2015/07/30 职场文书
python opencv人脸识别考勤系统的完整源码
2021/04/26 Python
python实现自动清理文件夹旧文件
2021/05/10 Python
vue3使用vue-router的完整步骤记录
2021/06/20 Vue.js
动画「进击的巨人」第86话播出感谢绘公开
2022/03/21 日漫