如何使用JavaScript取得iframe 的内容？

黑马骑士 · 发表于 9-2-2007 08:37 PM

如何使用JavaScript取得iframe 的内容？

如：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<SCRIPT language="JavaScript" type="text/JavaScript">
function isiFrameLoadComplete(iframename){
//加载完毕，取得iframe内容
//请问如何取得？
var ihtml=iframename;
}
</SCRIPT>
<body>
<iframe id="openblog" onload="isiFrameLoadComplete(this);" width="500" height="400" scrolling="no" frameborder="0" ></iframe>
<DIV id=State align=center></DIV>
</body>
</html>

复制代码

苦瓜汤 · 发表于 9-2-2007 09:19 PM

function isiFrameLoadComplete(iframename){
var ihtml = iframename.document.documentElement.innerHTML; //iframename.document.getElementById("foo"); 提取DOM物件
}

[ 本帖最后由苦瓜汤于 9-2-2007 09:21 PM 编辑 ]

黑马骑士 · 发表于 10-2-2007 08:17 AM

原帖由 苦瓜汤 于 9-2-2007 09:19 PM 发表
function isiFrameLoadComplete(iframename){
var ihtml = iframename.document.documentElement.innerHTML; //iframename.document.getElementById("foo"; 提取DOM物件
}

不能

index.htm

<!DOCTYPE HTML PUBLIC "-//W3C//Dtd HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Untitled</title>
</head>
<SCRIPT language="JavaScript" type="text/JavaScript">
function isiFrameLoadComplete(iframename){
// ihtml = iframename.documentElement.innerHTML; //iframename.document.getElementById("foo"); 提取DOM物件
document.getElementById("State").innerHTML=iframename.document.getElementById("leagueCode");
}
function runfun(){
}
</SCRIPT>
<body onload="runfun();">
<iframe src='1.htm' id="openblog" onload="isiFrameLoadComplete(this);" width="500" height="400" scrolling="no" frameborder="0" ></iframe>
<DIV id=State align=center></DIV>
</body>
</html>

复制代码

1.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<div id='leagueCode'>
Hello World!
</div>
</body>
</html>

复制代码

jasonmun · 发表于 10-2-2007 01:40 PM

1) 在iframe可以跑 onload 吗?
2) document.getElementById("State").innerHTML
=iframename.document.getElementById("leagueCode");

getElementById("leagueCode") 后应该还有东西吧?

苦瓜汤 · 发表于 10-2-2007 06:33 PM

对不起，漏了一个contentDocument。contentDocument是直接access iframe的window物件

<!DOCTYPE HTML PUBLIC "-//W3C//Dtd HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Untitled</title>
</head>
<script language="JavaScript" type="text/JavaScript">
function isiFrameLoadComplete(iframename){
ihtml = iframename.contentDocument.documentElement.innerHTML;
document.getElementById("state").innerHTML=ihtml;
}
function runfun(){
}
</script>
<body onload="runfun();">
<iframe src='1.htm' id="openblog" onload="isiFrameLoadComplete(this);" width="500" height="400" scrolling="no" frameborder="0" ></iframe>
<div id="state" align="center"></div>
</body>
</html>

复制代码

JR86 · 发表于 11-2-2007 12:27 AM

原帖由 苦瓜汤 于 10-2-2007 06:33 PM 发表
对不起，漏了一个contentDocument。contentDocument是直接access iframe的window物件

<!DOCTYPE HTML PUBLIC

"-//W3C//Dtd HTML 4.01 Transitional//EN"

"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">

<html>

<head>

<title>Untitled</title>

</head>

<script language="JavaScript" type="text/JavaScript">

function isiFrameLoadComplete(iframename){

ihtml = iframename.contentDocument.documentElement.innerHTML;

document.getElementById("state").innerHTML=ihtml;

}

function runfun(){

}

</script>

<body onload="runfun();">

<iframe src='1.htm' id="openblog"

onload="isiFrameLoadComplete(this);" width="500" height="400"

scrolling="no" frameborder="0" ></iframe>

<div id="state" align="center"></div>

</body>

</html>
复制代码
...

苦瓜里面的runfun()真得就只是为了fun而run的，哈哈哈！

还有，狼儿印象中IE很像没有支援contentDocument的，不过IE里面可以使用document.frames["name"]来解决啦！

以下是狼儿修改后的JS．

<!DOCTYPE HTML PUBLIC "-//W3C//Dtd HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Untitled</title>
</head>
<script language="JavaScript" type="text/JavaScript">
function isiFrameLoadComplete(iframename){
if(document.getElementById(iframename).contentDocument){
//Firefox
ihtml = document.getElementById(iframename).contentDocument;
}else{
// IE
ihtml = document.frames[iframename].document;
}
document.getElementById("state").innerHTML=ihtml.documentElement.innerHTML;
}
</script>
<body>
<iframe src="1.html" id="openblog" onload="isiFrameLoadComplete(this.id);" width="500" height="400" scrolling="no" frameborder="0" ></iframe>
<div id="state" align="center"></div>
</body>
</html>

复制代码

chingjun · 发表于 14-2-2007 06:21 AM

借这个楼来问一下。。
我有一面，里面有一个frame，id=frame1
然后那个frame里面有另一个frame，id=frame2
然后frame2里面有一个div
<div id="abc">xx</div>
然后我的script是在frame2里面的。。

firefox会把document当成是frame2
IE会把document当成是原本那面。。

我想读和改变它的innerhtml都不能哦。。
在IE里面拉。。
Object doesn't support this property or method

有什么办法吗？
谢谢啦。。

function element(id){
try{
// IE
return document.frames["frame1"].document.frames["frame2"].document.getElementById(id);
}catch(error){
try{
//Firefox
return document.getElementById("frame1").contentDocument.getElementById("frame2").contentDocument.getElementById(id);
}catch(error){
return document.getElementById(id);
}
}
}
a=element('abc').innerHTML

复制代码

		自动登录	找回密码
密码			注册

如何使用JavaScript取得iframe 的内容？

所属分类: 电脑手机

浏览过的版块