javascript - 如何使用JavaScript获取父iframe的父iframe？

Question

所以我有一个带有 iframe 的页面 index.html:

<iframe src="iframe1.html" width="500" height="400"></iframe>

在 iframe1.html 我有另一个嵌套的 iframe:

<iframe src="iframe2.html" width="500" height="400"></iframe>

在 iframe2.html 我有这段代码:

<script>
window.onload = function() {
    document.getElementById('change-color').onclick = function() {
        window.parent.document.body.style.backgroundColor = "red";
        return false;
    };
}
</script>

<a href="" id="change-color">Change Color</a>

当您单击“更改颜色”链接时，iframe 的父页面 iframe1.html 会变成红色背景色。相反，我希望父级的父级页面 index.html 获得颜色变化。如何访问它？

Answer 1

使用window.parent.parent 获取祖父窗口。所以你想要:

window.parent.parent.document.body.style.backgroundColor = "red";

如果你想要最顶层的父级，无论你有多深，你都可以使用window.top。见

Find most upper parent window with javascript