HTML5 a标签的download属性

最新推荐文章于 2024-05-07 11:56:11 发布

hsany330

最新推荐文章于 2024-05-07 11:56:11 发布

阅读量1.7k

点赞数

download属性能让我们指定浏览器下载时采用新的文件名称，也就是在客户端重命名下载文件。而不是链接上原始的文件名称。

添加download属性后，无论a标签的href属性链接到一个网页、图片、文本等，download属性都会强制触发下载操作，且自动命名文件为download属性。

如下代码

[html]view plaincopy 
   
 <!DOCTYPE html>  
 <html>  
 <body>  
 <p>点击 W3School 的 logo 来下载该图片：<p>  
 <a href="/i/w3school_logo_white.gif" download="w3logo.jpg">  
     <img border="0" src="/i/w3school_logo_white.gif">  
 </a>  
 </body>  
 </html>  

添加download属性后直接下载图片，而不是在浏览器中打开图片，且文件名自动修改成w3logo.jpg

点击链接测试：http://www.w3school.com.cn/tiy/t.asp?f=html_a_download (代码与本文稍有不同)

[html]view plaincopy 
   
 <a href="http://www.webhek.com/wordpress/wp-content/themes/webhek2/images/follow-us.jpg?8fe47c" download="我改名了.jpg">下载图片</a>  

[html]view plaincopy 
   
 <a href="http://blog.csdn.net/leytton" download="Leytton.pdf">下载网页</a>  

参考资料

W3School HTML <a> download 属性 http://www.w3school.com.cn/tags/att_a_download.asp

HTML5里download属性 http://www.webhek.com/download-attribute/

浏览器支持

IE	Firefox	Chrome	Safari	Opera

只有 Firefox 和 Chrome 支持 download 属性。

补充

CentOS下FireFox测试

转载：http://blog.csdn.net/leytton/article/details/38545299

hsany330

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5 a标签的download属性

download属性能让我们指定浏览器下载时采用新的文件名称，也就是在客户端重命名下载文件。而不是链接上原始的文件名称。添加download属性后，无论a标签的href属性链接到一个网页、图片、文本等，download属性都会强制触发下载操作，且自动命名文件为download属性。如下代码[html] view plain copy
复制链接

扫一扫