target="_parent"仅在当前文档嵌套于iframe或frame中且存在直接父级浏览上下文时生效:若在顶层则等价_self,单层嵌套时跳转至顶层,双层嵌套时跳转至中间层。

target="_parent 是有效的,但它的行为取决于当前页面是否真的嵌套在 <iframe></iframe> 或 <frame> 中——不是所有“父级窗口”场景都适用它。
target="_parent" 在什么情况下才真正起作用
只有当当前文档处于一个 <iframe></iframe>(或传统 <frame>)内,且该 <iframe></iframe> 本身不是顶层窗口(即它被嵌在另一个 <iframe></iframe> 或 <frameset></frameset> 中)时,target="_parent" 才会跳转到**直接父级浏览上下文**。
- 如果当前页就在顶层窗口(没有被任何
<iframe></iframe>包裹),target="_parent"等价于target="_self",链接仍在当前页打开 - 如果当前页在一层
<iframe></iframe>中(父页是顶层),target="_parent"就是打开在父页(即顶层窗口) - 如果嵌套了两层
<iframe></iframe>(A 套 B 套 C),C 中设target="_parent"会在 B 中打开,不是 A
为什么有时设了 target="_parent" 却没跳出 iframe
常见原因不是语法错,而是结构误判:
- 你以为自己在 iframe 里,其实页面是通过
location.href或 SPA 路由加载的,根本没 iframe - 父页面用了
sandbox属性(如sandbox="allow-scripts"但没加allow-popups或allow-top-navigation),浏览器会静默忽略target - 父页面设置了
document.domain或跨域限制,导致子 frame 无法访问parent.location,此时target="_parent"可能被降级为_self - 你用的是现代单页应用(如 React/Vue),路由靠 JS 控制,
<a></a>标签被拦截了,target根本没生效
更可靠的做法:用 JavaScript 显式控制父窗口跳转
当 target="_parent" 行为不确定时,直接调用 JS 更可控:
<a href="https://example.com" onclick="if (parent !== window) { parent.location.href = this.href; } else { window.location.href = this.href; } return false;">跳转到父级</a>
或者封装成函数复用:
<script>
function openInParent(href) {
if (parent !== window && parent.location) {
parent.location.href = href;
} else {
window.location.href = href;
}
}
</script><a href="#" onclick="openInParent('https://example.com'); return false;">跳转到父级</a>
- 显式判断
parent !== window比依赖target更准确 - 避免因 sandbox、CSP、跨域导致的静默失败
- 注意:若父页与子页跨域,
parent.location.href = ...会抛DOMException: Blocked a frame with origin ... from accessing a cross-origin frame,此时只能退回到window.open()或提示用户手动打开
替代 target 值:_top vs _parent 的实际区别
target="_top" 和 target="_parent" 都用于框架跳转,但语义和效果不同:
-
target="_parent":只向上一级,不管上面还有几层 -
target="_top":强制跳到最顶层窗口(即打破所有嵌套),只要没被 sandbox 完全禁掉,就一定跳出所有 iframe - 如果目标就是“确保离开当前 iframe”,优先用
target="_top";只有明确需要“只跳到直接父级”时才用_parent - 注意:
_top在顶层页中也等价于_self,不会报错或异常
真正容易被忽略的点是:浏览器对 target 的处理高度依赖当前文档的嵌入上下文,而不是 HTML 写得对不对。调试时先用 console.log(window.frameElement, parent === window) 确认层级关系,比反复改 target 值更有效。











