download属性仅对同源链接或blob url生效，跨域链接会忽略该属性并跳转；推荐用blob+url.createobjecturl()生成本地url配合download导出，注意内存释放与ios兼容性。
download 属性只对同源 <a></a> 链接生效，跨域或 Blob URL 需要额外处理
直接给 <a></a> 标签加 download 属性看似简单，但浏览器实际执行下载的前提是：链接的 href 必须指向同源资源（如 /data.json），或者是一个由 Blob 构造的 URL.createObjectURL() 本地 URL。如果 href 是跨域地址（比如 https://api.example.com/export），即使写了 download，浏览器也会忽略该属性并跳转页面——这不是 bug，是安全限制。
实操建议：
- 服务端导出接口必须返回
Content-Disposition: attachment; filename="xxx"，此时即使去掉download属性，也能触发下载（但无法控制文件名） - 前端生成内容（如 JSON、CSV）时，优先用
Blob + URL.createObjectURL()构造href，再配合download指定文件名 - 避免把
download和非同源href同时使用，否则行为不可靠（Chrome 会静默失败，Safari 可能报错Failed to load resource: Frame load interrupted）
用 Blob 和 URL.createObjectURL() 实现任意内容导出
这是最可控的一键导出方式，适用于运行时生成的数据（比如表格转 CSV、图表快照转 PNG、计算结果转 JSON）。关键不是“有没有 download 属性”，而是“href 是否指向一个可下载的本地 URL”。
示例（导出当前页面的 JSON 数据）：
const data = { timestamp: Date.now(), result: [1, 2, 3] };
const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'result.json';
a.click();
URL.revokeObjectURL(url); // 用完立即释放，避免内存泄漏
注意点：
-
type参数影响浏览器识别：导出 CSV 用text/csv;charset=utf-8，导出 Excel（.xlsx）不能直接用 Blob（需用SheetJS等库生成二进制） -
URL.createObjectURL()创建的是临时引用，不调用URL.revokeObjectURL()会导致内存持续占用 - 某些老版本 Safari 不支持
click()触发下载，需手动插入到 DOM 并模拟点击
导出大文件时，download 属性本身不解决性能问题
download 属性只是告诉浏览器“把这个 URL 当作文件下载”，它不参与数据生成、不压缩、不分块。如果导出的是 MB 级别的日志或表格，卡顿来自 Blob 构造或 JSON.stringify()，而不是 download。
优化方向：
- 避免一次性
JSON.stringify(largeArray)：改用流式序列化（如stream-json）或分页导出 - CSV 导出不用 JSON：逐行拼接字符串 +
new Blob([str], {type: 'text/csv'})，比 stringify 数组快得多 - 超大文件（>100MB）建议退回到服务端导出，前端只负责发起请求和监听
onprogress
移动端 Safari 对 download 的支持几乎为零
iOS/iPadOS 的 Safari 完全忽略 download 属性，无论 href 是同源还是 Blob URL。点击后要么打不开，要么在新标签页渲染文本内容（比如显示 JSON 字符串），根本不会下载。
可行方案：
- 检测
navigator.userAgent.includes('Safari') && !navigator.userAgent.includes('Chrome')，对 iOS 用户降级为“复制内容到剪贴板 + 提示粘贴到备忘录/Notes” - 服务端提供带
Content-Disposition的真实下载链接，并用window.open()或 iframe 方式触发（iOS 允许 iframe 加载 attachment） - 不强求“一键”，改为引导用户长按链接选择“下载”（需确保链接是真实可访问的同源路径）
真正难的不是写对 download，而是判断此刻该不该用它——同源？内容大小？目标平台？漏掉任一条件，按钮就只是个摆设。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
