Frame/IFrame contentDocumentProperty
Frame/IFrame Object
Definition and Usage
The contentDocument property returns the document contained in the frame as an HTML object.
The returned object can be handled using all standard DOM methods.
Note:For security reasons, the content of a document can only be accessed by another document from the same domain.
Syntax
frameObject.contentDocument
or
iframeObject.contentDocument
or
iframeObject.contentDocument
Browser Support
![]()
![]()
![]()
![]()
![]()
All major browsers support the contentDocument property.
Note:If a !DOCTYPE is specified, Internet Explorer 8 and later support the contentDocument property. For other IE versions, usecontentWindowproperty.
Example
Example
The browser example demonstrates how to modify the background color of the document in an iframe:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Example(example.com)</title>
<script>
function changeStyle(){
var x=document.getElementById("myframe");
var y=(x.contentWindow || x.contentDocument);
if (y.document)y=y.document;
y.body.style.backgroundColor="#0000ff";
}
</script>
</head>
<body>
<iframe id="myframe" src="demo_iframe.htm.html">
<p>Your browser does not support iframes.</p>
</iframe>
<br><br>
<input type="button" onclick="changeStyle()" value="Modify background color">
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Example(example.com)</title>
<script>
function changeStyle(){
var x=document.getElementById("myframe");
var y=(x.contentWindow || x.contentDocument);
if (y.document)y=y.document;
y.body.style.backgroundColor="#0000ff";
}
</script>
</head>
<body>
<iframe id="myframe" src="demo_iframe.htm.html">
<p>Your browser does not support iframes.</p>
</iframe>
<br><br>
<input type="button" onclick="changeStyle()" value="Modify background color">
</body>
</html>
Try it yourself »
Frame/IFrame Object Other Extensions