一、a标签download属性
a标签download属性是一个HTML5新增的属性，可以让用户在点击链接时下载所链接的资源，而不是在浏览器中打开它。然而，有些情况下，a标签download属性会失效，这个问题在很多场景下都会遇到。
二、a标签的download属性仅适用于
a标签download属性仅适用于同域（同源）的资源，如果要下载跨域资源，则需要使用服务器端脚本来处理。
例如：
Download PDF Download PDF
在这两个链接中，第一个是有效的，因为它下载的是同域下的资源。第二个链接会失败，因为它尝试下载跨域资源。
三、a标签中的download属性
a标签中的download属性只对超链接生效，对于通过JavaScript创建的Blob URL或者data URL是不起作用的。这种情况下，我们可以使用JavaScript来模拟下载行为。
例如：
const downloadFile = (blob, fileName) => {
const link = document.createElement("a");
link.href = window.URL.createObjectURL(new Blob([blob], { type: "application/octet-stream" }));
link.download = fileName;
link.click();
};
这个函数接收两个参数：要下载的数据blob和文件名fileName。它创建了一个临时的链接，并为其设置了对象URL作为链接的href属性。然后将文件名设置为download属性，以便浏览器自动启动下载。
四、a标签download属性只能同源
同源策略是浏览器的安全策略，它要求JavaScript只能与同域页面进行交互。同样的，download属性只适用于同源资源。如果需要下载跨域资源，我们可以使用服务器端脚本或者CORS策略来处理。
五、设置width属性对什么标签无效
设置width属性对于a标签是无效的。width属性只适用于图像、表格和表单元素。
总结
a标签download属性可以让用户轻松地下载链接资源，但是在某些情况下会失效。对于这种情况，我们需要使用JavaScript来模拟下载行为或者在服务器端进行处理。同时，我们要注意a标签download属性只适用于同源资源，并且设置width属性对于a标签是无效的。
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/184863.html
微信扫一扫 
支付宝扫一扫 