<p>Basically, I have an <code>iframe</code> embedded in a page and the <code>iframe</code> has some <a href="http://en.wikipedia.org/wiki/JavaScript" rel="noreferrer">JavaScript</a> routines I need to invoke from the parent page.</p>

<p>Now the opposite is quite simple as you only need to call <code>parent.functionName()</code>, but unfortunately, I need exactly the opposite of that.</p>

<p>Please note that my problem is not changing the source <a href="http://en.wikipedia.org/wiki/Uniform_Resource_Locator" rel="noreferrer">URL</a> of the <code>iframe</code>, but invoking a function defined in the <code>iframe</code>.</p>

Quirksmode had a
post on this
.
Since the page is now broken, and only accessible via archive.org, I reproduced it here:
IFrames
On this page I give a short overview of accessing iframes from the page they’re on. Not surprisingly, there are some browser considerations.
An iframe is an inline frame, a frame that, while containing a completely separate page with its own URL, is nonetheless placed inside another HTML page. This gives very nice possibilities in web design. The problem is to access the iframe, for instance to load a new page into it. This page explains how to do it.
Frame or object?
The fundamental question is whether the iframe is seen as a frame or as an object.
As explained on the
Introduction to frames
pages, if you use frames the browser creates a frame hierarchy for you (
```
top.frames[1].frames[2]
```
and such). Does the iframe fit into this frame hierarchy?
Or does the browser see an iframe as just another object, an object that happens to have a src property? In that case we have to use a standard
DOM call
(like
```
document.getElementById('theiframe'))
```
to access it.
In general browsers allow both views on 'real' (hard-coded) iframes, but generated iframes cannot be accessed as frames.
NAME attribute
The most important rule is to give any iframe you create a
```
name
```
attribute, even if you also use an
```
id
```
.
```
```
<iframe src="iframe_page1.html"
    id="testiframe"
    name="testiframe"></iframe>
```
```
Most browsers need the
```
name
```
attribute to make the iframe part of the frame hierarchy. Some browsers (notably Mozilla) need the
```
id
```
to make the iframe accessible as an object. By assigning both attributes to the iframe you keep your options open. But
```
name
```
is far more important than
```
id
```
.
Access
Either you access the iframe as an object and change its
```
src
```
or you access the iframe as a frame and change its
```
location.href
```
.
document.getElementById('iframe_id').src = 'newpage.html';
frames['iframe_name'].location.href = 'newpage.html';
The frame syntax is slightly preferable because Opera 6 supports it but not the object syntax.
Accessing the iframe
So for a complete cross–browser experience you should give the iframe a name and use the
```
```
frames['testiframe'].location.href
```
```
syntax. As far as I know this always works.
Accessing the document
Accessing the document inside the iframe is quite simple, provided you use the
```
name
```
attribute. To count the number of links in the document in the iframe, do
```
frames['testiframe'].document.links.length
```
.
Generated iframes
When you generate an iframe through the
W3C DOM
the iframe is not immediately entered into the
```
frames
```
array, though, and the
```
frames['testiframe'].location.href
```
syntax will not work right away. The browser needs a little time before the iframe turns up in the array, time during which no script may run.
The
```
document.getElementById('testiframe').src
```
syntax works fine in all circumstances.
The
```
target
```
attribute of a link doesn't work either with generated iframes, except in Opera, even though I gave my generated iframe both a
```
name
```
and an
```
id
```
.
The lack of
```
target
```
support means that you must use JavaScript to change the content of a generated iframe, but since you need JavaScript anyway to generate it in the first place, I don't see this as much of a problem.
Text size in iframes
A curious Explorer 6 only bug:
When you change the text size through the View menu, text sizes in iframes are correctly changed. However, this browser does not change the line breaks in the original text, so that part of the text may become invisible, or line breaks may occur while the line could still hold another word.