Accessing an IFrame's properties

A

Aaron Gray

Hi,

I want to access the properties of an IFrame but seem unable to get access
to the IFrames document body.

<html>

<body>
<iframe src="test.html" id="IFrame"></iframe>
</body>

<script>
var f = document.getElementById('IFrame');
f.document.body.innerHTML = "This is another test";
</script>

</html>

This writes to the main document not the IFrame.

I am doing something very basic wrong but cannot work out what. (I do know I
should be doing a open/write/close rather than an innerHTML but this is just
for testing access to the contained IFrames properties)

Help,

Aaron
 
T

Thomas 'PointedEars' Lahn

Aaron said:
I want to access the properties of an IFrame but seem unable to get access
to the IFrames document body.

<html>

<body>
<iframe src="test.html" id="IFrame"></iframe>
</body>

<script>
var f = document.getElementById('IFrame');
f.document.body.innerHTML = "This is another test";
</script>

</html>

This writes to the main document not the IFrame.
Click to expand...

Of course.
I am doing something very basic wrong but cannot work out what.
Click to expand...

You are obtaining a reference to an HTMLIFrameElement object, representing
an `iframe' element node in the document tree. By modifying the former's
proprietary `innerHTML' property, you modify the content of the `iframe'
element. This content is displayed only if the `iframe' element is not
supported.
(I do know I should be doing a open/write/close rather than an innerHTML
but this is just for testing access to the contained IFrames properties)
Click to expand...

You need to access the document object of the IFrame resource instead.

Proprietary: window.frames['IFrame'].document
(preferably with `name' instead)
<URL:http://research.nihonsoft.org/javascript/ClientReferenceJS13/frame.html>
<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/obj_window.asp>

Standards compliant: f.contentDocument
<http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-50708718>

Similar questions have been asked here before.


PointedEars
 
A

Aaron Gray

I want to access the properties of an IFrame but seem unable to get access
to the IFrames document body.
Click to expand...

Properties are accessable but content is not on IE 6, previous versions
allowed access to the contents.

Firefox allows access to the contents of an IFrame, but IE6 does not.

Aaron
 
T

Thomas 'PointedEars' Lahn

Aaron said:
Properties are accessable but content is not on IE 6, previous versions
allowed access to the contents.

Firefox allows access to the contents of an IFrame, but IE6 does not.
Click to expand...

Nonsense.


PointedEars
 
A

Aaron Gray

Properties are accessable but content is not on IE 6, previous versions
Nonsense.
Click to expand...

Try it and please send me some code that disputes this !

I would be most greatful if you can prove me wrong.

Aaron
 
A

Aaron Gray

Properties are accessable but content is not on IE 6, previous versions
<URL:http://pointedears.de/scripts/test/dom/iframe>
Click to expand...

I seem to be able to read but not modify innerHTML.

I'll modify my statement :-

IFrame content is readable but not modifiable from the parent
window.

Do you agree ?

Thurther :-

<iframe src="document.html" name="IFrame" id="IFrame"></iframe>
<div id="sourceViewDiv"></div>

document.getElementById("sourceViewDiv").innerHTML =
window.frames['IFrame'].document.body.innerHTML;
window.alert(window.frames['IFrame'].document.body.innerHTML);

The first script line fails but the alert works.

Am very confused,

Aaron
 
T

Thomas 'PointedEars' Lahn

Please provide attribution of quoted material, as described in
the Netiquette Guidelines (RFC1855) and the newsgroup's FAQ.[1]
vvvvvvvvvvvvvvvvv
Aaron said:
I seem to be able to read but not modify innerHTML.
Click to expand...

I overlooked that part.
I'll modify my statement :-

IFrame content is readable but not modifiable from the parent
window.

Do you agree ?
Click to expand...

That would depend on what you call "IFrame content". Try the URL again
(I modified the document). The first and third button do work for me in
IE 6.0 SP1 [Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0)]. All
buttons work in Firefox 1.5.0.1 [Mozilla/5.0 (X11; U; Linux i686; en-US;
rv:1.8.0.1) Gecko/20060313 Debian/1.5.dfsg+1.5.0.1-4 Firefox/1.5.0.1].
Thurther :-

<iframe src="document.html" name="IFrame" id="IFrame"></iframe>
<div id="sourceViewDiv"></div>

document.getElementById("sourceViewDiv").innerHTML =
window.frames['IFrame'].document.body.innerHTML;
Click to expand...

It does not appear as if you were attempting to modify the IFrame
document content here.
window.alert(window.frames['IFrame'].document.body.innerHTML);

The first script line fails but the alert works.
Click to expand...

ISTM either you have mixed up the sides of the assignment, or you have
described the wrong problem. If the latter, you should make sure that
you are operating on a Valid document first[2], and that
document.getElementById(...) returns an element object reference.[3]
"The first script line fails" is no error report.[4]


PointedEars
___________
[1] <URL:http://jibbering.com/faq/>
[2] <URL:http://validator.w3.org/>
[3] <URL:http://pointedears.de/scripts/test/whatami#inference>
[4] <URL:http://jibbering.com/faq/#FAQ4_43>
 
B

BootNic

Thomas 'PointedEars' Lahn said:
[snip]

That would depend on what you call "IFrame content". Try the URL
again (I modified the document). The first and third button do
work for me in IE 6.0 SP1 [Mozilla/4.0 (compatible; MSIE 6.0;
Windows NT 5.0)]. All buttons work in Firefox 1.5.0.1 [Mozilla/5.0
(X11; U; Linux i686; en-US; rv:1.8.0.1) Gecko/20060313
Debian/1.5.dfsg+1.5.0.1-4 Firefox/1.5.0.1].
Click to expand...
[snip]
How would it work in all them browsers if you replace contentDocument
with contentWindow.document?

--
BootNic Wednesday, April 05, 2006 4:15 PM

It's not that some people have willpower and some don't. It's that
some people are ready to change and others are not.
*James Gordon*
 
A

Aaron Gray

Thomas 'PointedEars' Lahn said:
Please provide attribution of quoted material, as described in
the Netiquette Guidelines (RFC1855) and the newsgroup's FAQ.[1]
vvvvvvvvvvvvvvvvv
Aaron said:
I seem to be able to read but not modify innerHTML.
Click to expand...

I overlooked that part.
I'll modify my statement :-

IFrame content is readable but not modifiable from the parent
window.

Do you agree ?
Click to expand...

That would depend on what you call "IFrame content". Try the URL again
(I modified the document). The first and third button do work for me in
IE 6.0 SP1 [Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0)]. All
buttons work in Firefox 1.5.0.1 [Mozilla/5.0 (X11; U; Linux i686; en-US;
rv:1.8.0.1) Gecko/20060313 Debian/1.5.dfsg+1.5.0.1-4 Firefox/1.5.0.1].
Thurther :-

<iframe src="document.html" name="IFrame" id="IFrame"></iframe>
<div id="sourceViewDiv"></div>

document.getElementById("sourceViewDiv").innerHTML =
window.frames['IFrame'].document.body.innerHTML;
Click to expand...

It does not appear as if you were attempting to modify the IFrame
document content here.
Click to expand...

No just reading its text into a div.
window.alert(window.frames['IFrame'].document.body.innerHTML);

The first script line fails but the alert works.
Click to expand...

ISTM either you have mixed up the sides of the assignment, or you have
described the wrong problem. If the latter, you should make sure that
you are operating on a Valid document first[2], and that
document.getElementById(...) returns an element object reference.[3]
"The first script line fails" is no error report.[4]
Click to expand...

It was returning null.

Your example shows the modification of IFrame innerHTML working.

Looks like it is a timing error in my code. Doing mods explicitly to the
IFrame on loading the parent document causes a 'null' value for that
documents body.

Many thanks for your help Thomas,

Aaron
 
D

Declan Naughton

Seeing as window.frames isn't a part of any w3c standard, surely there
must be another (standards-compliant) way to access the properties of a
document included using the iframe or object elements (preferably
object)... right?
 
L

Lasse Reichstein Nielsen

Declan Naughton said:
Seeing as window.frames isn't a part of any w3c standard, surely there
must be another (standards-compliant) way to access the properties of a
document included using the iframe or object elements (preferably
object)... right?
Click to expand...

Yes.
---
var iframeElem = document.getElementById("myIframeId");
var iframeDoc = iframeElem.contentDocument;
iframeDoc.body.style.backgroundColor="red"; // i'm in!
---

Does it work in IE? Ofcourse not.

In IE, iframe elements does not have a "contentDocument" property.
They do have a "contentWindow", so you can do:
 
T

Thomas 'PointedEars' Lahn

Declan said:
Seeing as window.frames isn't a part of any w3c standard, surely there
must be another (standards-compliant) way to access the properties of a
document included using the iframe or object elements (preferably
object)... right?
Click to expand...

Like many things, standards compliance is not an absolute on the Web. In
fact, there is no fully standards-compliant approach to the DOM as the W3C
DOM standards define only interfaces that can be implemented. However, the
implementation always is proprietary; so is also `document' or
`window.document' to implement _also_ the HTMLDocument interface of W3C DOM
Level 2 HTML. One could only argue that

document.getElementById("myIframeId").contentDocument

as Lasse suggested, is "more standards-compliant" than

window.frames[myIframeId].contentDocument

because the proprietary part of the former is "smaller". But I doubt this
holds water. However, knowing this, I also tend to call something
"standards compliant" if only the implementation is the proprietary part of
the reference.

Trying to achieve maximum standards compliance can have its drawbacks. For
example, usually you want to give your IFrame a name instead of an ID
because UAs want the `name' attribute value for the `target' property
value of a[href]s. Trying to be standards compliant here would mean

document.getElementsByName("myIframeName")[0].contentDocument

(not as this reference worm, of course) as compared to

window.frames[myIframeName].contentDocument

Certainly I would almost always prefer the latter here as first
alternative in a collection of dependent feature tests; it has
broader support, and is more efficient. Hopefully, the Web API
Specification will make that quasi-standard a specified standard
eventually.


Please quote the minimum of what you are replying to --

<URL:http://jibbering.com/faq/faq_notes/pots1.html>
<URL:http://www.safalra.com/special/googlegroupsreply/>

-- and don't use buggy Web interfaces to NetNews such as Developersdex's
AspNNTP. Google Groups' interface is slightly better than that (at least
it supports threads properly and with a few tweaks also automatic
quotation), but a newsreader program is best.


PointedEars
 
T

Thomas 'PointedEars' Lahn

Declan said:
Seeing as window.frames isn't a part of any w3c standard, surely there
must be another (standards-compliant) way to access the properties of a
document included using the iframe or object elements (preferably
object)... right?
Click to expand...

Like many things, standards compliance is not an absolute on the Web. In
fact, there is no fully standards-compliant approach to the DOM as the W3C
DOM standards define only interfaces that can be implemented. However, the
implementation always is proprietary; so is also `document' or
`window.document' to implement _also_ the HTMLDocument interface of W3C DOM
Level 2 HTML. One could only argue that

document.getElementById("myIframeId").contentDocument

as Lasse suggested, is "more standards-compliant" than

window.frames[myIframeId].contentDocument

because the proprietary part of the former is "smaller". But I doubt this
holds water. However, knowing this, I also tend to call something
"standards compliant" if only the implementation is the proprietary part of
the reference.

Trying to achieve maximum standards compliance can have its drawbacks. For
example, usually you want to give your IFrame a name instead of an ID
because UAs want the `name' attribute value for the `target' attribute
value of a[href]s. Trying to be standards compliant here would mean

document.getElementsByName("myIframeName")[0].contentDocument

(not as this reference worm, of course) as compared to

window.frames[myIframeName].contentDocument

Certainly I would almost always prefer the latter here as first
alternative in a collection of dependent feature tests; it has
broader support, and is more efficient. Hopefully, the Web API
Specification will make that quasi-standard a specified standard
eventually.


Please quote the minimum of what you are replying to --

<URL:http://jibbering.com/faq/faq_notes/pots1.html>
<URL:http://www.safalra.com/special/googlegroupsreply/>

-- and don't use buggy Web interfaces to NetNews such as Developersdex's
AspNNTP. Google Groups' interface is slightly better than that (at least
it supports threads properly and with a few tweaks also automatic
quotation), but a newsreader program is best.


PointedEars
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Trying to add text into an editable div that is in an iframe 0
Is it possible an iframe can overlapp another? 3
iframe's and inline code 2
Iframe cross-domain access with JavaScript 1
retreive cookies 4
Accessing the HTML source of a page loaded in an IFRAME in top-level JavaScript 6
Help with code 0
Accessing an embeded iframe 1

Members online

Total: 451 (members: 3, guests: 448)
Robots: 124

Forum statistics

Threads
474,141
Messages
2,570,814
Members
47,359
Latest member
Claim Bitcoin Earnings. $

Latest Threads

Top