javascript - 使用 javascript/html 控制 iframe 内容

Question

在我的网页中，我有一个像这样的 iframe:

<iframe src="thispage.html" width="100%" height="600" frameBorder="2"></iframe>

(iframe 是同一站点上的一个页面...)

我的问题是，是否可以在具有 iframe 的页面上使用 javascript 来控制“thispage.html”(比如使用 javascript 函数？)

Answer 1

是的，你可以。假设您的 iframe 的 ID 是 'myIFrame'

<iframe id="myIFrame" src="thispage.html"
    width="100%" height="600"
    frameBorder="2">
</iframe>

然后，在您的 JavaScript 中添加以下内容:

// Get the iframe
const iFrame = document.getElementById('myIFrame');

// Let's say that you want to access a button with the ID `'myButton'`,
// you can access via the following code:
const buttonInIFrame = iFrame.contentWindow.document.getElementById('myButton');

// If you need to call a function in the iframe, you can call it as follows:
iFrame.contentWindow.yourFunction();

希望对您有所帮助:)