我们相信:世界是美好的,你是我也是。平行空间的世界里面,不同版本的生活也在继续...

链接a里面有个download属性,可以控制文件下载的名字,头一次听说这事吧?这个download属性很罕见,那么,它是怎么使用的呢?有什么样的限制呢?这就是本文要探讨的问题。

苏南大叔:如何理解链接a的download属性?前端控制下载文件名 - a-attr-download
如何理解链接a的download属性?前端控制下载文件名(图2-1)

苏南大叔的程序如此灵动博客,记录苏南大叔和计算机代码的故事。测试环境:谷歌浏览器。

测试代码

www容器输出如下代码:

<a href="empty.png">打开图片</a><br/>
<a href="empty.png" download="自定义名字.zip">下载图片并改名甚至后缀类型</a><br/>
<a href="https://newsn.net/usr/themes/panda/assets/img/sunan.jpg" download="自定义名字.exe">无法控制跨域资源,download属性失效</a><br/>

前两个链接就是普通的本站图片,但是加上download属性后。文件打开动作就变成了文件下载动作,而且还可以通过download属性修改文件名称。

苏南大叔:如何理解链接a的download属性?前端控制下载文件名 - 运行截图
如何理解链接a的download属性?前端控制下载文件名(图2-2)

使用限制

下面的两种情况下,链接adownload属性是不生效的。

  • 代码不放在容器里面,本地双击.html文件打开的时候。
  • href的资源是跨域资源的时候,不是本站的资源的时候。

结束语

更多html相关经验文字,请点击:

如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留作者链接。

 【福利】 腾讯云最新爆款活动!1核2G云服务器首年50元!

 【源码】本文代码片段及相关软件,请点此获取更多信息

 【绝密】秘籍文章入口,仅传授于有缘之人   html5