获得iframe的html内容,跨浏览器使用javascript/jQuery获取iframe的内容

iframe是内联框架，允许你单独的HTML文件加载到一个现有的文件。您还可以加载文件的动态“src”属性。假设有一个需要iframe内容和过程使用JavaScript。下面的例子可以帮助你做，这已经是一个跨浏览器Firefox和IE浏览器的解决方案。

让我们加载一个简单的HTML文件在iFrame，并获得该文件的内容与方法getiframecontent JavaScript。

Get the content of Iframe

function getIframeContent(frameId){

var frameObj = document.getElementById(frameId);

var frameContent = frameObj.contentWindow.document.body.innerHTML;

alert("frame content : "+frameContent);

}

FrameContent.html

This is simple HTML file which is loaded inside the iframe.

what getIframeContentmethod do?

function getIframeContent(frameId){

var frameObj = document.getElementById(frameId);

var frameContent = frameObj.contentWindow.document.body.innerHTML;

alert("frame content : "+frameContent);

}

getElementById(frameid)–让IFrame的对象引用

contentwindow–是一个属性返回iFrame窗口对象

contentwindow.document–返回iFrame窗口文档对象。

contentwindow.document.body.innerhtml–返回的HTML内容iframe体。

你也可以访问任何标签元素在iFrame。这可以由标签名称/标识处理。让我们想象的使用案例：检索在iframe内容div元素。下面的语句将找回它。

frameObj.contentWindow.document.getElementById(“testFrameContent”).innerHTML

jQuery获取的方法是怎么样的呢？

使用jquery操作iframe

1 内容里有两个ifame

2 如果内容里面有一个ID为mainiframe的ifame

ifame包含一个someID

you want to get this content

得到someID的内容

$("#mainiframe").contents().find("someID").html() html 或者 $("#mainiframe").contains().find("someID").text()值

2 如上面所示

leftiframe中的jQuery操作mainiframe的内容someID的内容

$("#mainframe",parent.document.body).contents().find("someID").html()或者 $("#mainframe",parent.document.body).contents().find("someID").val()

get

function getiframe(){

var content = $("#testFrame").contents().find("#testFrameContent").html();

alert(content);

}