base 标签不能控制表单在新窗口打开，其 target 属性被浏览器忽略；表单新窗口提交必须显式设置 form 的 target="_blank"，或用 JavaScript 拦截后 fetch + window.open 实现。
base 标签本身不能控制表单在新窗口打开
<base> 只影响页面中所有相对 URL 的解析基准（比如 <a href="page.html">、<img src="logo.png">），它**不处理 target 行为**，也不改变 <form> 的提交方式或窗口目标。试图靠 <base target="_blank"> 让表单自动新窗口提交是无效的——浏览器会忽略 target 属性在 <base> 中的设置（HTML 规范明确禁止）。
表单新窗口提交必须显式设置 form 的 target 属性
唯一可靠的方式是在 <form> 标签上直接写 target="_blank"：
<form action="/submit" method="post" target="_blank"> <input name="q" value="test"> <button type="submit">Submit</button> </form>
注意以下几点：
-
target="_blank"必须写在<form>上，不是<button>或<input type="submit"> - 如果
action是相对路径（如"api/submit"），它的解析仍受<base href="https://example.com/">影响，但target行为与<base>无关 - 现代浏览器对
target="_blank"会默认添加rel="noopener"安全防护；若需兼容旧逻辑（如访问window.opener），得手动加rel="opener"，但不推荐
JavaScript 替代方案：避免 target="_blank" 的副作用
直接设 target="_blank" 会导致表单以 GET 方式（即使声明 method="post"）在某些旧浏览器中降级，且无法拦截提交前逻辑。更可控的做法是阻止默认提交，用 fetch 或 XMLHttpRequest 发送数据，再 window.open() 导航：
立即学习“前端免费学习笔记（深入）”；
document.querySelector('form').addEventListener('submit', e => {
e.preventDefault();
const formData = new FormData(e.target);
fetch(e.target.action, {
method: 'POST',
body: formData
})
.then(() => window.open('/result-page', '_blank'))
.catch(err => console.error('Submit failed:', err));
});
这种写法的关键点：
- 绕过表单原生提交机制，完全掌控请求和后续跳转
- 可统一处理错误、加载状态、验证等，
target="_blank"做不到 - 注意：如果后端返回的是 HTML 页面（而非 JSON），且你想直接显示它，
window.open()后需手动写入响应内容，或改用location.replace()配合隐藏 iframe 等技巧
base 标签的 target 属性被忽略是浏览器强制行为
即便你写了 <base target="_blank">，检查 DOM 或实际测试都会发现它对任何表单、链接的打开方式零影响。这是 HTML5 规范要求：target 在 <base> 中属于“无意义属性”，浏览器必须忽略。常见误判场景包括：
- 开发者看到
<base href="..." target="_blank">就以为全局生效，结果点击链接仍是当前页跳转 - 调试时混淆了
<a>的target（有效）和<base>的target（无效） - 用 Webpack/Vite 构建时，插件自动注入
<base>并错误携带target，导致团队困惑
真正需要统一 target 行为？用 JavaScript 批量绑定事件，或服务端模板循环注入 target 属性——别指望 <base>。
