rel="noreferrer"完全不影响浏览器历史记录，它仅控制Referer头、window.opener访问权限及自动添加noopener；不留历史记录必须用location.replace()或history.replaceState()配合JavaScript接管导航。

点击 <a> 链接时不留下浏览器历史记录？rel="noreferrer" 不行

直接说结论：rel="noreferrer" 完全不影响历史记录，它只控制 Referer 请求头和 window.opener 访问权限。想跳转时不留 history 记录，必须用 JavaScript 配合 history.replaceState() 或 location.replace()，不能靠 <a> 的纯 HTML 属性实现。

rel="noreferrer" 实际影响哪几件事？

这个属性常被误用，它真正起作用的只有三处：

• Referer 请求头不发送（目标页 document.referrer 为空字符串）
• 新页面无法通过 window.opener 访问原页面（即使同源）
• 自动附加 rel="noopener" 效果（防范 window.opener.location 劫持）

它对 history.pushState()、history.back()、地址栏“后退”按钮完全无感——点击后依然会新增一条历史条目。

真正能跳过历史记录的两种方式

如果目标是“用户点一下就去新页，但按返回键不回到当前页”，只能放弃原生 <a href> 的默认行为：

立即学习“前端免费学习笔记（深入）”；

Wechat Article Html

将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。

下载

• 用 location.replace("https://example.com")：直接替换当前 history 条目，不新增
• 用 history.replaceState(null, "", "https://example.com") + location.href：更精细控制（比如保留滚动位置），但需手动触发跳转

示例（带 fallback 的安全写法）：

<a href="#" onclick="event.preventDefault(); location.replace('https://example.com');">无痕跳转</a>

注意：不要用 history.pushState() 后再 location.href，那会多留一条空记录；replace 类操作必须在跳转前完成。

为什么不用 target="_blank" 加 rel="noreferrer"？

这是高频误区。加了 target="_blank" 后，原页面历史记录照常增加，新开页的历史栈也独立存在——和“不留记录”目标完全相反。而且：

• 移动端 Safari 对 target="_blank" 支持不稳定，可能静默失败
• rel="noreferrer" 在这里只切断来源信息，对 history 毫无干涉
• 若真要开新页又不想污染原页 history，应该用 window.open(url, "_blank", "noopener,noreferrer")，但仍是新开 tab/window，不是“无痕跳转”

核心得记住：HTML 超链接的本质就是创建 history 条目，想绕过它，就得跳出 <a> 的语义，用 JS 主动接管导航逻辑。