使用a标签下载时对不同浏览器的兼容性

1、a标签下载常规做法：

var a = document.createElement('a') // 先创建a标签

a.href = base // base是后端返回的数据

· a.download = '下载.jpg' // 下载的图片名

a.click(); // 开始下载

这样做完发现在IE里没有反应，原因是IE不支持a标签的download 属性，IE需要用到msSaveBlob方法

2、a标签下载兼容IE做法：

var a = document.createElement('a') // 先创建a标签

a.href = blob // base是后端返回的数据

· a.download = '下载.jpg' // 下载的图片名

if (navigator.msSaveBlob) {

// 兼容IE

var blob = Blob([blob], { type: 'image/jpg'});

return navigator.msSaveBlob(blob, '月报报表.jpg');

}

a.click(); // 开始下载

3、在火狐发现也是不能下载，原因是body里没有a标签，解决的方法就是把创建的a标签添加到body里

兼容性所有浏览器的写法就是：

var a = document.createElement('a') // 先创建a标签

document.body.appendChild(a);

a.style.display='none';

a.href = blob // base是后端返回的数据

· a.download = '下载.jpg' // 下载的图片名

if (navigator.msSaveBlob) {

// 兼容IE

var blob = Blob([blob], { type: 'image/jpg'});

return navigator.msSaveBlob(blob, '月报报表.jpg');

}

a.click(); // 开始下载