a标签下载图片及js执行下载图片

原因:

我发现href的值是网络地址就是添加了download属性还是会直接打开图片而不是直接下载,只有写成相对地址添加了download属性才会执行下载,但是存在兼容性问题

如下:

<a href="https://www.iamyun.net/eastcomlab/surprisestatic/1524548025839250.png" download><span>下载</span></a>

这样的我试的结果在chrome浏览器 frefox,ie浏览器里面直接打开而不是下载,360浏览器,QQ浏览器执行下载。这个属性存在兼容性问题。我想的是服务端把图片弄成一个压缩包的话 href的地址就算是一个网络地址,但是直接打不开就会执行下载。这也是一个办法。只要是浏览器直接解析不出来的东西都是可以执行下载动作的。

相对地址:<a href="2.png" download="测试"><span>下载</span></a> html文件和要下载的图片我放在同一目录下不管是服务器上还是本地。是可以执行下载的。

在HTML5中,a标签除了href外,还新增了一个重要的属性,就是download。如广大前端工作人员所知,通常如果a标签的href属性=‘xxx’,如果xxx可以被浏览器解析,那么xxx就会被页面打开,而不是被下载,只有当浏览器不能解析的时候,那么才会被下载到本地。通常js,图片,html等文档均可被解析,MP4,mp3,zip等文件不会被解析。那么如果我们要通过a下载那些可以被解析的文件怎么办,那就需要这个download属性了

download:可以设置值,也可以不设置。设置的话就是下载时候的名称。固定的

遇到的原因:

a标签下载图片及js执行下载图片

我发现我加上以后还是打开这个网络图片而没有执行下载的动作

我放到服务器上写成相对地址

a标签下载图片及js执行下载图片

a标签下载图片及js执行下载图片

下载完毕!

2,其他尝试

a标签下载图片及js执行下载图片

方法:

a标签下载图片及js执行下载图片

测试的谷歌浏览器会重新打开一个空白页执行下载图片(不管是网络图片还是相对地址图片)可能谷歌浏览器版本的问题

其他浏览器正常执行下载ie除外。