从父页面调用 iframe 中的 JavaScript 代码

假设您的iFrame的ID是“targetFrame”，并且您要调用的函数是：targetFunction()

document.getElementById('targetFrame').contentWindow.targetFunction();

您也可以使用 而不是 访问框架。window.framesdocument.getElementById

// this option does not work in most of latest versions of chrome and Firefox
window.frames[0].frameElement.contentWindow.targetFunction(); 

这里有一些怪癖需要注意。

1. HTMLIFrameElement.contentWindow可能是更简单的方法，但它不是一个标准属性，一些浏览器不支持它，主要是较旧的浏览器。这是因为 DOM 级别 1 HTML 标准对对象没有任何说明。window

2. 您也可以尝试 ，这是一些较旧的浏览器允许的，但IE不允许。即便如此，该标准并没有明确规定您取回对象，原因与（1）相同，但是如果您愿意，可以在此处选择一些额外的浏览器版本。HTMLIFrameElement.contentDocument.defaultViewwindow

3. window.frames['name']返回窗口是最古老，因此也是最可靠的界面。但是，您必须使用属性才能按名称获取框架，这有点丑陋/已弃用/过渡。（会更好，但IE不喜欢这样。name="..."id="..."

4. window.frames[number]也非常可靠，但知道正确的索引是诀窍。你可以逃脱这个，例如。如果您知道页面上只有一个 iframe。

5. 完全有可能子iframe尚未加载，或者其他问题使其无法访问。您可能会发现反转通信流更容易：也就是说，让子 iframe 在完成加载并准备好回调时通知其脚本。通过将它自己的一个对象（例如回调函数）传递给父脚本，该父脚本可以直接与 iframe 中的脚本进行通信，而不必担心它与哪个 HTMLIFrameElement 相关联。window.parent