如何从父 window 访问 iframe window 变量？

Question

我正在尝试围绕 iframe 构建一个包装器，它需要使用 iframe 中的一些内容。

iframe 脚本将一些变量分配给 iframe window，如下所示：

(function() {
   window.courseData = "course data goes here..."
})(window);

然后父级 window 正在访问 iframe window:

document.addEventListener('DOMContentLoaded', () => {  
    const iframeWindow = document.getElementById("iframe").contentWindow;
    console.log(iframeWindow); // Window about:blank > courseData {...}
})

当我在浏览器中查看控制台日志时，它向我显示了 iframe window 对象及其所有属性，包括 courseData 对象。但是，当我尝试直接访问 courseData 时，它 returns undefined...

console.log(iframeWindow.courseData); // undefined

我终其一生都想不通为什么我可以看到它，但不能访问它。如有任何想法，我们将不胜感激！

注意：很遗憾，我无法更改 iframe 的内容，因此我无法使用其他方法将数据传递给父级。

另一个注意事项：iframe 来自服务器上的同一目录，因此不存在任何跨源问题。

Answer 1

经过反复试验，我自己弄明白了！

对于任何感兴趣的人来说，问题是 iframe window 在我的父函数被调用时尚未完全加载，因此变量返回未定义。

解决方法是在调用该函数之前使用一个函数来检查 iframe 何时完成加载，为此我在此处的另一个堆栈溢出 post 上找到了一些有用的代码：

How to check if iframe is loaded or it has a content?

如何从父 window 访问 iframe window 变量？

How to access iframe window variables from parent window?

javascript

iframe