Frame/IFrame contentDocument 属性
 Frame/IFrame 对象
 Frame/IFrame 对象
定义和用法
contentDocument 属性以 HTML 对象返回框架容纳的文档。
可以通过所有标准的 DOM 方法来处理被返回的对象。
注意:由于安全原因,文档的内容只能通过同一个域名下的另外一个文档访问。
语法
frameObject.contentDocument
或者
iframeObject.contentDocument
或者
iframeObject.contentDocument
浏览器支持





所有主要浏览器都支持 contentDocument 属性
注意:如果指定了 !DOCTYPE, Internet Explorer 8 及更高版本支持 contentDocument 属性,其他IE版本请使用 contentWindow 属性。
实例
实例
通过浏览器实例展示了如何在修改iframe中文档的背景颜色:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>代码学院(codexy.cn)</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">
<p>你的浏览器不支持iframes。</p>
</iframe>
<br><br>
<input type="button" onclick="changeStyle()" value="修改背景颜色">
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>代码学院(codexy.cn)</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">
<p>你的浏览器不支持iframes。</p>
</iframe>
<br><br>
<input type="button" onclick="changeStyle()" value="修改背景颜色">
</body>
</html>
尝试一下 »
 Frame/IFrame 对象
 Frame/IFrame 对象			
						
			
 JavaScript 教程
JavaScript 教程 JavaScript 对象
JavaScript 对象 jQuery 教程
jQuery 教程 JSON 教程
JSON 教程 AngularJS 教程
AngularJS 教程 Angular 2 教程
Angular 2 教程 Vue.js 教程
Vue.js 教程 React 教程
React 教程 jQuery UI 教程
jQuery UI 教程 jQuery EasyUI 教程
jQuery EasyUI 教程 AJAX 教程
AJAX 教程 Highcharts 教程
Highcharts 教程 Google Maps API 教程
Google Maps API 教程 ES6 教程
ES6 教程 TypeScript教程
TypeScript教程 ES6 标准入门
ES6 标准入门