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 相关文章推荐
jQuery EasyUI API 中文文档 - Parser 解析器
Sep 29 Javascript
在浏览器窗口上添加遮罩层的方法
Nov 12 Javascript
JavaScript中的bold()方法使用详解
Jun 08 Javascript
JS给Textarea文本框添加行号的方法
Aug 20 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
Dec 28 Javascript
数组Array的一些方法(总结)
Feb 17 Javascript
JS简单添加元素新节点的方法示例
Feb 10 Javascript
webpack4.0打包优化策略整理小结
Mar 30 Javascript
React 路由懒加载的几种实现方案
Oct 23 Javascript
vue中音频wavesurfer.js的使用方法
Feb 20 Vue.js
vue3如何优雅的实现移动端登录注册模块
Mar 29 Vue.js
Ajax实现异步加载数据
Nov 17 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
发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载
2007/07/21 Javascript
javascript 基础篇1 什么是js 建立第一个js程序
2012/03/14 Javascript
javascript限制文本框只允许输入数字(曾经与现在的方法对比)
2013/01/18 Javascript
Function.prototype.bind用法示例
2013/09/16 Javascript
XMLHttpRequest处理xml格式的返回数据(示例代码)
2013/11/21 Javascript
jQuery实现表格行上移下移和置顶的方法
2015/05/22 Javascript
基于jQuery实现的双11天猫拆红包抽奖效果
2015/12/01 Javascript
jQuery+CSS实现滑动的标签分栏切换效果
2015/12/17 Javascript
Bootstrap零基础学习第一课之模板
2016/07/18 Javascript
Vue.js每天必学之指令系统与自定义指令
2016/09/07 Javascript
基于AngularJS前端云组件最佳实践
2016/10/20 Javascript
jQuery和JavaScript节点插入元素的方法对比
2016/11/18 Javascript
js 定位到某个锚点的方法
2016/11/19 Javascript
JS实现颜色梯度与渐变效果完整实例
2016/12/30 Javascript
vue2+el-menu实现路由跳转及当前项的设置方法实例
2017/11/07 Javascript
微信小程序以ssm做后台开发的实现示例
2020/04/08 Javascript
JavaScript this指向相关原理及实例解析
2020/07/10 Javascript
[56:45]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第一局
2016/02/28 DOTA
[38:27]完美世界DOTA2联赛PWL S2 Forest vs FTD.C 第二场 11.26
2020/11/30 DOTA
Python模块学习 re 正则表达式
2011/05/19 Python
在Python程序中操作MySQL的基本方法
2015/07/29 Python
python利用装饰器进行运算的实例分析
2015/08/04 Python
python Gunicorn服务器使用方法详解
2019/07/22 Python
python实现密码强度校验
2020/03/18 Python
基于python实现生成指定大小txt文档
2020/07/20 Python
让IE可以变相支持CSS3选择器
2010/01/21 HTML / CSS
英国50岁以上人群的交友网站:Ourtime
2018/03/28 全球购物
幼儿园老师辞职信
2014/01/20 职场文书
高三毕业典礼主持词
2014/03/27 职场文书
跑吧孩子观后感
2015/06/10 职场文书
学历证明范文
2015/06/16 职场文书
大学运动会加油稿
2015/07/22 职场文书
2016年学校安全教育月活动总结
2016/04/06 职场文书
Python中常见的导入方式总结
2021/05/06 Python
pytorch中的model=model.to(device)使用说明
2021/05/24 Python
MySQL远程无法连接的一些常见原因总结
2022/09/23 MySQL