/    Sign up×
Community /Pin to ProfileBookmark

frame.contentWindow vs frame.contentDocument

Copy linkTweet thisAlerts:
Feb 19.2009

One more question about manipulating iframes. In a script I’ve looked through to investigate AJAX file uploads, there is this technique for accessing the contents of an iframe:

[CODE] if(frame.contentWindow)
{
var thebody = frame.contentWindow.document.body;

}else if(frame.contentDocument)
{
var thebody = frame.contentDocument.document.body;
}[/CODE]

I haven’t been able to find much info on contentWindow and contentDocument. In fact, other sources I’ve found talk only about using contentWindow to access an iframe’s contents, ignoring contentDocument completely. What is the difference between the two, and what browsers is the contentDocument check targeting? Any modern browsers, or is this a backward compatibility thing?

to post a comment
JavaScript

9 Comments(s) ↴

Copy linkTweet thisAlerts:
@ragheb_khaseebFeb 19.2009 — for IE and firefox i used the following


document.getElementById("frame_id").contentDocument.document

or frames["frame_id"].contentDocument.document;
Copy linkTweet thisAlerts:
@tarsusauthorFeb 19.2009 — And that works in both? See, that's strange, because pretty much all discussion I've found online says to use contentWindow for both IE and Firefox.

I guess both of those browsers support both properties, then. So I'd really like to know which browsers only support one or the other. I hate using code I don't understand! I don't want to be using a conditional that only exists to support some 10-year-old browser. But on the other hand, I don't want to just use one method and never realize that it's not working in some modern browser I didn't think to test in.
Copy linkTweet thisAlerts:
@ragheb_khaseebFeb 19.2009 — i was working on cross-domain problem, i faced many problem to talk with the iframes, after 5 months of work i solved it, the only property that i used is contentDocument


sorry about my English
Copy linkTweet thisAlerts:
@johnnyjApr 21.2009 — I've been trying to figure out cross domain iframe resizing for a while. I've seen so many 'solutions', but not all of them work in all instances, and it's hard to know which is the best. Any ideas?

JohnnyJ
Copy linkTweet thisAlerts:
@callMeAlApr 18.2010 — Quite important difference is that '.contentWindow' isn't supported by Google Chrome(and '.contentDocument' is).

The question I keep asking myself is why should I use iframe's 'document' or 'window' objects if iframe's content and properties can be accessed from the host window through simple reference(f.e. '.getElementById()' etc.)? Could someone please explain it to me briefly?

I'm new to JS so the answer may be simple but I still don't know it?.

Thanks!
Copy linkTweet thisAlerts:
@Sterling_IsfineApr 19.2010 — Quite important difference is that '.contentWindow' isn't supported by Google Chrome[/quote]Yes it is.
The question I keep asking myself is why should I use iframe's 'document' or 'window' objects if iframe's content and properties can be accessed from the host window through simple reference(f.e. '.getElementById()' etc.)?[/quote]How do you do that?

You can do it via [I]window.frames[/I], but using a reference to an iframe element, you have to use [I].contentWindow[/I] or [I].contentDocument[/I].
Copy linkTweet thisAlerts:
@BolderSep 13.2010 — Using Greasemonkey, the upper solutions woudn't work for me. (returning null or unknow as far as I remember)

so I added another case and it worked out:

[CODE]
 if(iframe_object.contentDocument){
return iframe_object.contentDocument;
}else if(iframe_object.contentWindow){
return iframe_object.contentWindow.document;
}else{
return iframe_object.document;
}
[/CODE]
Copy linkTweet thisAlerts:
@Satish_JadhavJun 19.2011 — Hi,

I have the same issue with my code.

My code is:

var ifrm = document.getElementById('frame1');

alert(ifrm.contentDocument);

here I get "ifrm.contentDocument" as undefined !

My code works well on all the browsers but I get the above undefined in case of chrome only. Please note I'm using the HTML/CSS files which are on my local machine/path and NOT on server.

Any suggestions?

Thanks in Advance.

Satish
Copy linkTweet thisAlerts:
@ArmalonMar 20.2012 — Maybe this link can answer your question?

http://www.w3schools.com/jsref/prop_frame_contentdocument.asp
Note: Internet Explorer 8 (and higher) supports the contentDocument property only if a !DOCTYPE is specified. For earlier versions of IE, use the contentWindow property.[/QUOTE]
×

Success!

Help @tarsus spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.6,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...