如何使用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 。 看到

使用JavaScript查找最上層的父窗口