Javascript获取IFrame内容(兼容IE&FF) (转)
但是这在Firefox下无效。
所以，想到在Firefox下用FireBug来调试。经过调试发现在Firefox下可用以下代码来实现:
详细代码如下:
TestIFrame.htm:
<head>
<script type="text/javascript">
function f(){
var doc;
if (document.all){//IE
doc = document.frames["MyIFrame"].document;
}else{//Firefox
doc = document.getElementById("MyIFrame").contentDocument;
}
doc.getElementById("s").style.color="blue";
}
</script>
</head>
<body onload="f()">
<iframe id = "MyIFrame" name = "MyIFrame" src = "MyIFrame.htm" width = "100" height="100">
</body>
</html>
MyIFrame.htm:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<div id="example">
<h3 id="example_title">Javascript 中父窗口与子窗口的交互</h3>
<div id="example_main">
<!--************************************* 实例代码开始 *************************************-->
<script type="text/javascript">
<!--
function openWindow()
{
newWindow = window.open('','newWindow','height=300,width=300,scrollbars=auto');
if (newWindow != null)
{
var windowHTML= "<html><head><title>preview</title></head>";
windowHTML += "<body><h1 align='center'>";
windowHTML += "这是子窗口!</h1><hr><div align='center'><form action='#' method='get'>";
windowHTML += "<input type='button' value='将父窗口的背景设为红色' onclick='window.opener.document.bgColor=\"red\";'
/><br>";
windowHTML += "<br ><input type='button' value='关闭' onclick='self.close();' />";
windowHTML += "</form></div></body></html>";
newWindow.document.write(windowHTML);
newWindow.focus();
}
}
//-->
</script>
<input value='打开子窗口' onclick="openWindow();" type="button">
<input type="button" value="将子窗口的背景设为蓝色" onclick="if (window.newWindow)
{newWindow.document.bgColor='blue';newWindow.focus();}" />
<!--************************************* 实例代码结束 *************************************-->
</div>
</body>
</html>
本文出自 “露水阑珊” 博客，请务必保留此出处http://wintys.blog.51cto.com/425414/123303
iframe框架内页：
<head>
<title>框架内页</title>
</head>
<body>
<div>
<input id="txt1" name="txt1" type="text" value="测试" />
</div>
</body>
</html>
<p>
iframe1中文本框的值:</p>
<p>
<input type="button" name="Submit" value="getValue" onclick="getValue()" />
</p>
<script type="text/javascript">
function getValue(){
var ofrm1 = document.getElementById("frame1").document;
if (ofrm1==undefined)
{
ofrm1 = document.getElementById("frame1").contentWindow.document;
var ff = ofrm1.getElementById("txt1").value;
alert("firefox/chrome取值结果为:" + ff);
}
else
{
var ie = document.frames["frame1"].document.getElementById("txt1").value;
alert("ie取值结果为:" + ie);
}
}
</script>
1. 打印iframe
eg. frameName.document.execCommand('print');
2. 获取iframe
eg. var ifr_window = window.frames["frameName"];
3. 获取iframe中的元素
eg1. 将iframe中id为elementId 的元素置为不显示：
var ifr_window = window.frames["frameName"];
ifr_window.elementId.style.display = 'none';
eg2. 获取iframe中id为listTable的表格
var oTable = window.frames["myFrame"].document.all.listTable;
4. 隐藏或显示表格的某列
js函数：
function setHiddenOrShowCol(oTable, iCol, type) {
for (i = 0; i < oTable.rows.length ; i++) {
oTable.rows[i].cells[iCol].style.display = type;
}
}
调用举例，将id为listTable的表格元素的第4列置为不显示：
var oTable = window.frames["myFrame"].document.all.listTable;
setHiddenOrShowCol(oTable, 3, 'none');
调用举例2，将id为listTable的表格元素的第4列置为显示：
var oTable = document.frames.myFrame.document.all.listTable;
setHiddenOrShowCol(oTable, 3, 'block');
