<a>

焦点

<a></a>在没有设置 href 属性时，是无法获取焦点的。

下载

常用的下载方法

const downloadByUrl = (url: string, filename: string) => {
    if (!url) throw new Error('当前没有下载链接');

    const a = document.createElement("a");
    a.style.display = "none";
    a.href = url;
    a.download = filename;
    // 使用target="_blank"时，添加rel="noopener noreferrer" 堵住钓鱼安全漏洞 防止新页面window指向之前的页面
    a.rel = "noopener noreferrer";
    document.body.append(a);
    a.click();

    setTimeout(() => {
        a.remove();
    }, 1000);
};

download 使用注意点

1. 同源 URL 的限制

   download 只在同源 URL 或 blob: 、 data: 协议起作用

   首先，非同源 URL 会进行导航操作。其次，如果非要下载，那么正如上面的文档所说，可以先将其转换为 blob: 或 data: 再进行下载。

2. download 与 Content-Disposition 的优先级

   当两者都指定了 filename 时，会优先使用 Content-Disposition 中的文件名。

---

你真的会用<a>标签下载文件吗?