window.open(url, '_blank', 'noopener noreferrer') 首次调用会聚焦新标签页，但后续调用常保留在原页面——这是浏览器对已存在目标标签页的复用机制所致，并非 Bug，而是符合规范的设计行为。
`window.open(url, '_blank', 'noopener noreferrer')` 首次调用会聚焦新标签页，但后续调用常保留在原页面——这是浏览器对已存在目标标签页的复用机制所致，并非 bug，而是符合规范的设计行为。
在 Web 开发中，window.open() 的焦点行为常被误解为“始终新开并聚焦”，但实际上其表现取决于浏览器对目标窗口/标签页的识别逻辑。当使用 _blank 作为 target 时，现代浏览器（Chrome、Firefox、Edge）默认采用标签页复用策略：若同一 URL 已在某个未关闭的标签页中打开，后续 window.open() 调用可能直接激活（focus）该已有标签页——但受制于用户交互策略（Intervention Policy），仅首次由用户手势（如 click）触发的 window.open() 允许自动聚焦新窗口；后续调用即使在同一会话中，也会被静默降级为“后台打开”（即不切换焦点），以防止恶意页面频繁劫持用户注意力。
这意味着：
- ✅ 第一次点击 → 新建标签页 + 自动聚焦（符合预期）
- ⚠️ 第二次及以后点击 → 若目标 URL 已存在，浏览器可能复用标签页；即使强制新建，也不再自动聚焦（因缺少连续的、可信赖的用户激活状态）
解决方案：确保每次均为“全新”窗口上下文
一种经实践验证的有效方法是：先创建一个临时命名窗口，立即关闭，再用相同名称打开目标 URL。这可重置浏览器的窗口映射状态，使其将后续调用视为“首次打开”：
function openUrlInNewTab(url) {
const tempName = '_temp_' + Date.now();
// 创建并立即关闭临时窗口，清除旧关联
const tempWin = window.open('', tempName);
if (tempWin && !tempWin.closed) {
tempWin.close();
}
// 使用同一 name 再次 open → 浏览器视为新窗口
return window.open(url, tempName, 'noopener,noreferrer');
}
// 使用示例
document.getElementById('myLink').addEventListener('click', (e) => {
e.preventDefault();
openUrlInNewTab('https://example.com');
});
? 注意：name 参数是关键。若始终使用 _blank，浏览器无法区分调用上下文；而使用动态唯一 name（如带时间戳）配合“先开后关”技巧，能有效绕过复用缓存，恢复首次打开的聚焦行为。
替代思路与限制说明
- ❌ 不推荐强行 newWindow.focus()：现代浏览器普遍屏蔽非用户手势触发的 focus() 调用，尤其在跨域或后台标签页场景下会静默失败。
- ✅ 更健壮的做法是引导用户操作：例如在按钮旁添加提示“将在新标签页中打开”，或使用 —— 原生链接天然享有更宽松的焦点策略，且语义清晰、可访问性友好。
- ? 所有主流浏览器均遵循此行为（Chrome ≥60、Firefox ≥58、Edge ≥79），属 W3C 浏览器干预标准的一部分，不应视为兼容性缺陷，而应作为设计约束纳入考量。
总结：该现象本质是浏览器对用户体验与安全性的主动平衡。开发者应避免依赖不可靠的自动聚焦，转而通过明确的 UI 提示、语义化 HTML 或可控的窗口命名策略来达成一致的交互预期。
