HTML中< a>标签中的download属性是否要配和js脚本才能生效?
发布网友
发布时间：2022-04-19 23:50
我来回答
共2个回答
懂视网
时间：2022-04-20 04:11
链接中加入download属性可以使用户将文件下载下来而不是直接用浏览器打开,截止到目前为止对HTML5提供支持的浏览器已经对这个属性支持得比较好了,下面我们就来详细看一下HTML5中的强制下载属性download使用实例解析:
HTML5 的 Download 属性用来强制浏览器下载对应文件，而不是打开。Chrome 和 Firefox 等浏览器太过于强大，也许是为了增强用户体验，当用户点击的资源文件可以被它们识别的时候（例如 pdf 会直接在浏览器打开，mp3、mp4 等媒体直接用浏览器内置播放器播放）。但有时候，用户其实是希望直接下载而不是在浏览器上看看，这时就可以加上这个属性，属性值会对下载的文件重命名：
<a href="downloadpdf.php" download="download.pdf">点击直接下载并保存成 download.pdf 文件</a>
如果你确定这个资源是用户肯定会下载的，就可以加上这个属性，还可以用 JS 或者手动改变想要保存的文件名。
在html里创建一个是下载链接是方便的，添加一个<a>标签和指向文件的href属性就行了。但是某些文件不会被下载（比如图像，pdf，txt，doc），相反，他们会在浏览器中被打开。
如果你的站点是有服务器端的，你可以通过配置.htaccess文件来使得那些文件可以被下载。如果你的站点是被WordPress.com或者github页面托管的（静态页面），那么轻考虑使用<a>标签的download属性
使用“Download”属性
download属性是html5规范的一部分，它表现为一个下载链接，而不是一个导航的链接。
download属性也允许你去重命名一个需要下载的文件。比如，一个文件存放在服务器上，如果这个文件是自动生成的，一般来说它被都命名为一个系统的数字和破折号的组合，例如acme-doc-2.0.1.txt，我们可以重命名这个下载文件的名字，用户下载后看到的文件名可以是一个比较好的名字，例如Acme Documentation (ver. 2.0.1).txt，像这样增加用户体验（不要忘记文件的拓展名）。
XML/HTML Code复制内容到剪贴板
<a href="downloadpdf.php" download="download.pdf">点击直接下载并保存成 download.pdf 文件</a>[object Object]
可以看一下这个demo地址：http://tutsplus.github.io/download-attribute/index.html
一些注意：
Firefox考虑到安全问题，该下载文件必须是从自己的服务器或域名中的，否则将在浏览器中打开。
在Chrome和Opear中，如果说下载文件不是在子集的服务器或域名中，这些浏览器会忽视download属性，换句话来说，文件名不变。
提供后备方案：
在写本文的时候，download属性并没有在Safari和IE中实现，但是IE声称，download属性的实现已经在开发日程顶部了。
在这期间，我们可以使用一个后备方案去兼容那些浏览器。我们需要去下载Modernizr的download属性特征测试。
然后添加以下脚本：
JavaScript Code复制内容到剪贴板
if ( ! Modernizr.adownload ) {
var $link = $('a');
$link.each(function() {
var $download = $(this).attr('download');
if (typeof $download !== typeof undefined && $download !== false) {
var $el = $('<p>').addClass('download-instruction').text('Right-click and select "Download Linked File"');
$el.insertAfter($(this));
}
});
}这个脚本是去测试浏览器是否支持download属性的，如果浏览器不支持的话，它就会想有download属性的<a>标签下面，插入一个有download-instruction类的<p>标签，并给予文字指引使用右键下载。
热心网友
时间：2022-04-20 01:19
download对同源下的资源有效
非同源的资源不能通过download属性修改下载文件的名称，请通过服务器返回下载头中设定名称
...>标签中的download属性是否要配和js脚本才能生效?
非同源的资源不能通过download属性修改下载文件的名称，请通过服务器返回下载头中设定名称
静态ip - StormProxies
"StormProxies是全球大数据IP资源服务商，其住宅代理网络由真实的家庭住宅IP组成，可为企业或个人提供满足各种场景的代理产品。点击免费测试（注册即送1G流量）StormProxies有哪些优势？1、IP+端口提取形式，不限带宽，IP纯净高匿；2、覆盖全球200+的国家与地区，超7000万住宅IP。3、高可靠性，24小时稳定运行，平均99.99%的可用率；4、性价比更高，便宜好用，单个IP也能享受最优价格，没有额外费用；5、易于使用，支持HTTP/HTTPS/SOCKS5协议，提供多种API参数，网络集成更快捷；6、客服全天在线为您排忧解难，并可根据您的业务需求制定更合适的代理…StormProxies是全球大数据IP资源服务商，其住宅代理网络由真实的家庭住宅IP组成，可为企业或个人提供满足各种场景的代理产品。点击免费测试（注册即送1G流量）StormProxies有哪些优势？1、IP+端口提取形式，不限带宽，IP纯净高匿；2、覆盖全球20...
target="mainFrame" 什么意思 为什么要加在超级链接后面,起什么作用...
这个目标的值对所有没有指定目标的 <a> 标签是默认目标，它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的，除非和文档标题 <base> 标签中的 target 属性一起使用。3、_parent 这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口...
html怎么实现网页中文件下载功能
一、使用<a>标签来完成 这样当用户打开浏览器点击链接的时候就会直接下载文件。但是有个情况，比如txt,png,jpg等这些浏览器支持直接打开的文件是不会执行下载任务的，而是会直接打开文件，这个时候就需要给a标签添加一个属性“download”；二、使用按钮进行监听 按钮监听又可以分为两种方法：1、是window.op...
你不知道的HTML
该download属性是几年前添加到规范中的,它允许您指定当单击链接时,应该下载而不是访问它。<ahref="/example.pdf"download>DownloadFile</a> 如果没有值,该download属性会强制下载链接页面。或者,您可以提供一个值,浏览器将其用作下载资源的建议文件名。<ahref="/example.pdf"download="my-download.pdf">DownloadF...
HTML中<a>链接标签的用法
属性 值 描述 charset char_encoding HTML5 中不支持。规定被链接文档的字符集。coords coordinates HTML5 中不支持。规定链接的坐标。download filename 规定被下载的超链接目标。href URL 规定链接指向的页面的 URL。hreflang language_code 规定被链接文档的语言。me...
如何确保页面中的js加载完全
对于Defer属性是这样写的：Using the attribute at design time can improve the download performance of a page because the browser does not need to parse and execute the script and can continue downloading and parsing the page instead.也就是说：如果是编写脚本的时候加入defer属性，...
HTML中 标签想实现跳转链接功能应该怎样实现?
一、href属性 1、可以链接到项目的的文件上，也可以链接到URL网址上；<a href="/index.html">指向本网站中的一个页面的链接</a> <a href="http://www.baidu.com/">指向万维网上的页面的链接</a> 2、a标签中可以使用文本也可以使用图片；<a href="/index.html"><img border="0" src=...
html标签<object>请教
param就是这个类的属性标签，wmode就是属性名，transparent是属性值。控制了这个组建的行为。object embed 其实功能是一样的，只不过不同浏览器支持的标签不一样，两个都写是为了兼容浏览器而已！--- 补充：好像是IE5以前只认识object,object是IE独有的标签，其他的浏览器不认识的。到了IE6貌似两个都...
如何将一个html页面中嵌入另一个html页面
1、首先，要嵌入html并不一定要写js代码，如图使用iframe标签，设置其src属性即可。注意其scrolling="auto"以添加滚动条。另外，其width和height要单独设置。2、其链接到的html页面内容如图所示。给其添加如图meta标签，增加自动刷新功能。3、在Python编写的httpserver中（Tornado），这两个url的请求都要处理...
HTML5中的a标签新增了哪些属性
但在HTML5中<a>标签是超链接HTML5中<a>标签新属性charset：html5不支持，指url的字符编码coords：html5 不支持,指链接的坐标。 downloadNew：指定下载链接 hreflang ：目标 URL 的基准语言，仅在 href 属性存在时使用。 mediaNew ：目标 URL 的媒介类型，仅在 href 属性存在时使用且默认值为all。
