请描述一下 a 标签的 download 属性的作用。

推荐答案

<a> 标签的 download 属性用于指定浏览器下载链接指向的资源，而不是导航到该资源。它允许用户通过点击链接直接下载文件，并可以为下载的文件指定一个文件名。

本题详细解读

download 属性是 HTML5 中新增的一个属性，它仅对 <a> 标签有效。其主要作用如下：

1. 强制下载： 当 <a> 标签带有 download 属性时，浏览器会忽略资源的 MIME 类型，强制将该资源下载到本地。即使链接指向的是浏览器可以渲染的资源，例如图片、文本或 PDF 文件，也会进行下载。

2. 自定义文件名： download 属性可以接受一个字符串作为参数，这个字符串会被用作下载文件的文件名。如果没有指定文件名，浏览器通常会使用资源的原始文件名（如果存在）或 URL 的最后一段作为默认文件名。

3. 支持跨域下载： download 属性通常可以配合 blob 对象和 URL.createObjectURL 方法实现跨域下载。通过 JavaScript 创建一个 blob 对象，将需要下载的数据放入，然后创建 blob 的 URL，并将该 URL 设置到 <a> 标签的 href 属性，并使用 download 属性，即可实现跨域下载。

4. 兼容性： 大部分现代浏览器都支持 download 属性，包括 Chrome、Firefox、Safari 和 Edge 等。但请注意，老版本的浏览器可能不支持此属性。

使用 download 属性的基本语法如下：

<a href="path/to/file.pdf" download="my_document.pdf">下载 PDF</a>

<a href="path/to/image.jpg" download="profile_image.jpg">下载图片</a>

<a href="/server/download" download="data.csv">从服务器下载 CSV 文件</a>

注意事项:

• download 属性只对同源的 URL 或 blob: URL 起作用。对于跨域的 URL，浏览器可能会出于安全考虑而阻止下载。
• 为了避免文件名出现问题，最好使用字母数字、下划线和连字符等字符来命名文件。
• 如果服务端设置了 Content-Disposition 响应头，该响应头的优先级高于 download 属性指定的文件名。

总结: 无