HTML5 a标签的download属性

介绍一个HTML5的新特性 a标签的download属性；

目前市场上面支持的浏览器有限；

html:

<!DOCTYPE html>
<html>
<body>

<p>点击 W3School 的 logo 来下载该图片：<p>

<a href="/i/w3school_logo_white.gif" download="w3logo">
<img border="0" src="/i/w3school_logo_white.gif" alt="W3School">
</a>

</body>
</html>

参考链接：

http://www.zhangxinxu.com/wordpress/2016/04/know-about-html-download-attribute/

http://www.runoob.com/tags/att-a-download.html

原文地址：https://www.cnblogs.com/mr-wuxiansheng/p/8353615.html

时间： 2024-08-30 11:00:55

HTML5 a标签的download属性的相关文章

HTML5 a标签的down属性进行图片下载

a标签中的down属性时HTML5新增的属性,此属性指示浏览器下载URL而不是导航到URL,因此将提示用户将其保存为本地文件.目前该属性的兼容性如下: 具体代码实现: 1 /* 2 主要原理:利用a标签的download属性以及canvas的toDataURL() 3 selector: 图片的选择器 4 name:被下载图片的命名 5 */ 6 downloadPicture (selector, name) { 7 let image = new Image() 8 // 解决跨域 Canv

关于a标签的download属性失效问题

在a标签上添加一个download属性,可以使a标签的导航属性变为下载属性 <a href="http://dowload.xx" download="file_name"></a> 但前提是下载的资源文件必须与网页是在同一个域名下,或者资源文件开发core,否则download属性就会失效原文地址:https://www.cnblogs.com/wrhbk/p/12310893.html

IE浏览器a标签无法下载问题解决（IE浏览器a标签download属性不兼容问题解决）

//下载文件流函数,只支持get方法. export function downBlob(payload) { return new Promise(((resolve, reject) => { // 获取时间戳 let timestamp=new Date().getTime(); // 获取XMLHttpRequest let xmlResquest = new XMLHttpRequest(); // 发起请求 xmlResquest.open("GET", payloa

HTML5 <a>标签download 属性

一.简单实例 <a href="../images/1.jpg" download="下载图片.jpg"> 点击按钮下载 </a> 二.说明: 定义和用法 download 属性规定被下载的超链接目标. 在 <a> 标签中必须设置 href 属性. 该属性也可以设置一个值来规定下载文件的名称.所允许的值没有限制,浏览器将自动检测正确的文件扩展名并添加到文件 (.img, .pdf, .txt, .html, 等等). 注: 1.h

html5 audio 标签属性

src:String型,所播放音频的 url. autoplay:值为autoplay,如果出现该属性,则音频在就绪后马上播放. controls:值为controls,如果出现该属性,则向用户显示控件,比如播放按钮. loop:值为loop,如果出现该属性,则每当音频结束时重新开始播放. audio 有几个事件: onended:当媒介已抵达结尾时运行脚本,也就是当前歌曲播放完了,这里的"媒介"是指audio标签. onloadstart:当浏览器开始加载媒介数据时

html5 meta标签属性整理

html5 meta标签属性整理前言:不知道有没有人觉得,html的meta标签描述的头部信息特别多,有针对的SEO的头部信息,也有针对移动设备的头部信息,今日特地在网上搜集资料自己稍微对其整理一下,终于找个个描述得比较全的网站(点击进入),本人有点强迫症,硬是把它写进自己的博客,当然这还不是最全的,以后会慢慢修改至完整. 基本标签声明文档使用的字符编码 <meta charset='utf-8'> 声明文档的兼容模式 //指示IE以目前可用的最高模式显示内容 <meta http-

HTML5 a元素download属性

HTML5中a元素新增加了download属性,可以指定链接不打开,而直接启动浏览器的下载功能,下载链接目标,浏览器支持: Chrome Firefox IE Opera Safari Edge 14+ 20+ 不支持 15+ 不支持 ? 虽然Firefox.Chrome都支持,但两者有区别,Firefox官方文档MDN标注: This attribute is only honored for links to resources with the same-origin. Same-Orig

html/html5中的download属性

兼容性不是很好, 只是了解一下: 主要表现在跨域策略的处理上,Chrome浏览器和FireFox浏览器: 如果需要下载的资源是跨域的,包括跨子域,在Chrome浏览器下,使用download属性是可以下载的,但是,并不能重置下载的文件的命名:而FireFox浏览器下,则download属性是无效的,也就是FireFox浏览器无论如何都不支持跨域资源的download属性下载. 而,如果资源是同域名的,则两个浏览器都是畅通无阻的下载,不会出现下载变浏览的情况. demo <a href="l

JS/HTML 保存图片到本地：HTML <a> download 属性

JS如何保存图片到本地呢?自己百度一下吧! 这里想要说的是,可以利用 HTML 的 <a> 标签来是实现保存图片到本地的功能,参考代码如下: <a href="http://wx.qlogo.cn/mmopen/ajNVdqHZLLDR2d0sYTtWb0ev4IRnQlM3z2NrD9kicibwMJYXWnwZIjxVo8uAeqdM7QB2WqjLWYBx1OSrOp8zpLbI5Y2VIibOKo2eclJVJcqd8k/0" download="