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 相关文章推荐
解决IE6的PNG透明JS插件使用介绍
Apr 17 Javascript
js如何设置在iframe框架中指定div不显示
Dec 04 Javascript
完美实现bootstrap分页查询
Dec 09 Javascript
轻松实现js弹框显示选项
Sep 13 Javascript
运用js教你轻松制作html音乐播放器
Apr 17 Javascript
纯javascript版日历控件
Nov 24 Javascript
js实现交通灯效果
Jan 13 Javascript
react同构实践之实现自己的同构模板
Mar 13 Javascript
Vue 中文本内容超出规定行数后展开收起的处理的实现方法
Apr 28 Javascript
微信小程序设置滚动条过程详解
Jul 25 Javascript
vue 封装 Adminlte3组件的实现
Mar 18 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
Jul 19 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
迅雷下载《中学科技》怀旧期刊下载
2021/02/27 无线电
PHP中10个不常见却非常有用的函数
2010/03/21 PHP
php获取网页中图片、DIV内容的简单方法
2014/06/19 PHP
PHP缓存集成库phpFastCache用法
2014/12/15 PHP
php实现字符串翻转的方法
2015/03/27 PHP
php动态添加url查询参数的方法
2015/04/14 PHP
PHP配置把错误日志以邮件方式发送方法(Windows系统)
2015/06/23 PHP
1亿条数据如何分表100张到Mysql数据库中(PHP)
2015/07/29 PHP
JS 如何获取radio选中后的值及不选择取radio的值
2013/10/28 Javascript
js 点击页面其他地方关闭弹出层(示例代码)
2013/12/24 Javascript
jQuery的end()方法使用详解
2015/07/15 Javascript
jQuery无刷新切换主题皮肤实例讲解
2015/10/21 Javascript
Seajs是什么及sea.js 由来,特点以及优势
2016/10/13 Javascript
微信小程序之网络请求简单封装实例详解
2017/06/28 Javascript
微信JSAPI Ticket接口签名详解
2020/06/28 Javascript
JavaScript时间戳与时间日期间相互转换
2017/12/11 Javascript
Vue.js自定义事件的表单输入组件方法
2018/03/08 Javascript
Vue基本使用之对象提供的属性功能
2019/04/30 Javascript
原生javascript中this几种常见用法总结
2020/02/24 Javascript
原生js+canvas实现下雪效果
2020/08/02 Javascript
JavaScript 事件代理需要注意的地方
2020/09/08 Javascript
flask中的wtforms使用方法
2018/07/21 Python
python 字典操作提取key,value的方法
2019/06/26 Python
Python全面分析系统的时域特性和频率域特性
2020/02/26 Python
PyQt5的QWebEngineView使用示例
2020/10/20 Python
Crocs欧洲官网:Crocs Europe
2020/01/14 全球购物
酒店总经理欢迎词
2014/01/08 职场文书
运动会开幕式解说词
2014/02/05 职场文书
素质教育标语
2014/06/27 职场文书
公务员党员评议表自我鉴定
2014/09/14 职场文书
业绩倒数第一的检讨书
2014/09/24 职场文书
私用公车造成事故检讨书
2014/11/16 职场文书
特此通知格式
2015/04/27 职场文书
哈姆雷特读书笔记
2015/06/29 职场文书
八一建军节主持词
2015/07/01 职场文书
Redis主从复制操作和配置详情
2022/09/23 Redis