浏览器下载文件

Posted 2020-07-13 看起来没睡醒

我们可能会想到一个最简单的方法，就是直接按钮a标签链接一张图片，类似下面这样：

<a href="large.jpg">下载</a>

但是，想法虽好，实际效果却不是我们想要的，因为浏览器可以直接浏览图片，因此，我们点击下面的“下载”链接，并是不下载图片，而是在新窗口直接浏览图片。

例如，我们希望点击“下载”链接下载图片而不是浏览，直接增加一个download属性就可以：

<a href="large.jpg" download>下载</a>

结果在Chrome浏览器下（FireFox浏览器因为跨域限制无效）：
改为<a href="index_logo.gif" download="_5332_.gif">下载</a>即可

是否支持download属性的监测
要监测当前浏览器是否支持download属性，一行JS代码就可以了，如下：

var isSupportDownload = ‘download‘ in document.createElement(‘a‘);