87,994
社区成员
发帖
与我相关
我的任务
分享请问如何向动态创建的iframe中添加子元素？
源代码如下：
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<script language="JavaScript">
<!--
var objFrame;
var objV;
function test(){
var vFrameName = "f" + div1.uniqueID;
div1.innerHTML = "<iframe id='" + vFrameName + "' src='noname4.html'></iframe>";
objFrame = window.frames(vFrameName);
objFrame.document.onreadystatechange = test2;
}
function test2(){
window.status += objFrame.document.readyState;
if(objFrame.document.readyState != "complete") return;
objV = objFrame.document.createElement("<div style='width:100px;height:20px;border:1px solid #000000;'></div>");
objV.innerHTML = "aaa";
objFrame.document.body.appendChild(objV);
}
function test3(){
alert(objFrame.document.body.innerHTML);
}
//-->
</script>
</head>
<body onload="test()">
<div id="div1"></div>
<button onclick="test3();"></button>
</body>
</html>
代码很简单，就是在div1中塞一个iframe,iframe对应的窗口对象是objFrame，在objFrame.document初始化完成后，向objFrame.document.body中塞一个div,然后点击button看objFrame.document.body.innerHTML，在IE5中发现为""，除非在一个时间间隔后(比如在初始化完成后按一个按钮或window.setTimeout等)来执行test2，而在IE6中可以看到那个塞入的div，请教这是何故？有没有什么解决办法，还请大侠们指导！
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<script language="JavaScript">
<!--
var objFrame;
var objV;
function test(){
var vFrameName = "f" + div1.uniqueID;
div1.innerHTML = "<iframe id='" + vFrameName + "' src='noname4.html'></iframe>";
objFrame = window.frames(vFrameName);
objFrame.document.onreadystatechange = test2;
}
function test2(){
window.status += objFrame.document.readyState;
if(objFrame.document.readyState != "complete") return;
objV = objFrame.document.createElement("<div style='width:100px;height:20px;border:1px solid #000000;'></div>");
objV.innerHTML = "aaa";
objFrame.document.body.appendChild(objV);
}
function test3(){
alert(objFrame.document.body.innerHTML);
}
//-->
</script>
</head>
<body onload="test()">
<div id="div1"></div>
<button onclick="test3();"></button>
</body>
</html>
代码很简单，就是在div1中塞一个iframe,iframe对应的窗口对象是objFrame，在objFrame.document初始化完成后，向objFrame.document.body中塞一个div,然后点击button看objFrame.document.body.innerHTML，在IE5中发现为""，除非在一个时间间隔后(比如在初始化完成后按一个按钮或window.setTimeout等)来执行test2，而在IE6中可以看到那个塞入的div，请教这是何故？有没有什么解决办法，还请大侠们指导！
...全文
请发表友善的回复…
发表回复
saucer 2002-08-22
- 打赏
- 举报
try this on IE5
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<script language="JavaScript">
<!--
var objFrame;
var objV;
function test(){
var vFrameName = "f" + div1.uniqueID;
div1.innerHTML = "<iframe id='" + vFrameName + "' src='about:blank'></iframe>";
objFrame = window.frames(vFrameName);
objFrame.document.onreadystatechange = test2;
}
function test2(){
window.status += objFrame.document.readyState;
if(objFrame.document.readyState != "complete") return;
objV = objFrame.document.createElement("DIV");
objV.style.width = "100px";
objV.style.height= "20px";
objV.style.border = "1px solid #000000";
objV.innerHTML = "aaa";
objFrame.document.body.appendChild(objV);
}
function test3(){
alert(objFrame.document.body.innerHTML);
}
//-->
</script>
</head>
<body onload="test()">
<div id="div1"></div>
<button onclick="test3();"></button>
</body>
</html>
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<script language="JavaScript">
<!--
var objFrame;
var objV;
function test(){
var vFrameName = "f" + div1.uniqueID;
div1.innerHTML = "<iframe id='" + vFrameName + "' src='about:blank'></iframe>";
objFrame = window.frames(vFrameName);
objFrame.document.onreadystatechange = test2;
}
function test2(){
window.status += objFrame.document.readyState;
if(objFrame.document.readyState != "complete") return;
objV = objFrame.document.createElement("DIV");
objV.style.width = "100px";
objV.style.height= "20px";
objV.style.border = "1px solid #000000";
objV.innerHTML = "aaa";
objFrame.document.body.appendChild(objV);
}
function test3(){
alert(objFrame.document.body.innerHTML);
}
//-->
</script>
</head>
<body onload="test()">
<div id="div1"></div>
<button onclick="test3();"></button>
</body>
</html>
saucer 2002-08-22
- 打赏
- 举报
poor dude, still need to support IE5? :-)
abent 2002-08-21
- 打赏
- 举报
因为原来做HTC时发现IE5的HTC中的oncontentready事件不能正确触发，而IE6的可以，不知道是不是又是类似的问题？
