Control iframe content with javascripthtml - Stack Overflow

admin管理员组

文章数量:1198384

Within my webpage I have an iframe like so:

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

(The iframe is of a page on the same site...)

My question is, is it possible to use javascript on the page that has the iframe to control the 'thispage.html' (like use javascript functions?)

Within my webpage I have an iframe like so:

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

(The iframe is of a page on the same site...)

My question is, is it possible to use javascript on the page that has the iframe to control the 'thispage.html' (like use javascript functions?)

• javascript
• html

Share Improve this question Follow edited Oct 21, 2013 at 15:32 Jacob Mattison 51.1k1111 gold badges108108 silver badges128128 bronze badges asked Oct 21, 2013 at 15:31 Ilan KleimanIlan Kleiman 1,20955 gold badges1919 silver badges3838 bronze badges 2

• thispage.html is the main html file or the file you are loading into iframe. – Bharath R Commented Oct 21, 2013 at 15:33
• related question – Blazemonger Commented Jun 5, 2014 at 18:49

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 17

Yes you can. Say your iframe's ID is 'myIFrame'

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

Then, add the following in your 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();

Hope it helps :)

Yes, if you give your iframe an ID, for example

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

You can access the inner window like this:

var iw = document.getElementById("MyIframe").contentWindow;

So you can call its functions e.g.

iw.theFunctionInsideIframe();

And you can locate the DOM elements like

var anElement = iw.document.getElmentByID("myDiv");

本文标签： Control iframe content with javascripthtmlStack Overflow