【翻译】使用javascript获取iframe的内容

时间 2019-11-10

标签翻译使用 javascript 获取 iframe 内容栏目 JavaScript 繁體版

原文原文链接

Iframe是一个内嵌框架，它容许你任意的加载HTML文件到你如今的document里面，你可以经过“src”属性来动态的加载文件。那么假如你要经过javascript获取Iframe框架里面的内容而且处理它。那么这里有一个例子能够帮助如何去作。而且这些例子经过了FireFox浏览器和IE的兼容。先加载一个简单的Html文件到iframe中来看看效果。而后经过javascript中的getIframeContent方法来获取文件的内容。 javascript

GetIframeDetails.html html

<html>
 <body>
 <iframe id="testFrame" src="FrameContent.html" >
 </iframe>
<a href="#" onclick="getIframeContent('testFrame');">Get the content of Iframe</a>
 </body>
<script>
 function getIframeContent(frameId){
 var frameObj = document.getElementById(frameId);
 var frameContent = frameObj.contentWindow.document.body.innerHTML;
 alert("frame content : "+frameContent);
 }
 </script>
 </html>

FrameContent.html

<html><body>
 <div id="testFrameContent" style="border:1px;">
 This is simple HTML file which is loaded inside the iframe.
 </div>
 </body>
 </html>

经过 getIframeContent方法怎么作？

function getIframeContent(frameId){
 var frameObj = document.getElementById(frameId);
 var frameContent = frameObj.contentWindow.document.body.innerHTML;
 alert("frame content : "+frameContent);
 }

getElementById(frameId) – 获取所引用的iframe对象
contentWindow – 它是一个属性，返回的是指定的frame或者iframe所在的window对象
contentWindow.document – 返回的是所指定的iframe文档对象
contentWindow.document.body.innerHTML –返回的是iframe中body部分的html

你能够获取iframe里面任意的标签元素。也能够经过标签的name/id来处理。让咱们假设一个使用场景：假如咱们要获取iframe里面的，div的内容。那么咱们能够经过下面这条语句来检索它 java

frameObj.contentWindow.document.getElementById(“testFrameContent”).innerHTML 浏览器

原文连接：http://manikandanmv.wordpress.com/2009/11/06/getting-iframe-content-in-javascript/ 框架