操作 iframe里面的dom元素

最新推荐文章于 2022-12-20 22:39:15 发布

陆康永

最新推荐文章于 2022-12-20 22:39:15 发布

阅读量4.8k

点赞数 2

分类专栏：特效集合 javascript基础

javascript基础同时被 2 个专栏收录

35 篇文章 0 订阅

订阅专栏

特效集合

14 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JS操作iframe里的dom</title>
<meta name="keywords" content="JavaScript, 网络技术, dom, iframe, javascript" />
<meta name="description" content="使用JavaScript在IE和Firefox下进行iframe的DOM操作今天就写个完整的使用JavaScript进行iframe DOM操作的文章啦~跟大家讨论下IE和Firefox下iframe DOM操作的差异，然后写一个父窗口操作子窗口DOM，子窗口操作父窗口DOM，子窗口操作子窗口DOM的实例。" />
<style type="text/css">
body{
margin:0;
padding:0;
}
#wIframeA,#wIframeB{
width:400px;
height:400px;
float:left;
}
</style>
</head>
<body>
<h1 style="text-align:center">JS操作iframe里的dom</h1>
<p style="margin:0px auto;width:210px;display:block;"><a href="http://www.css88.com/archives/2343" title="使用JavaScript在IE和Firefox下进行iframe的DOM操作" target="_blank">文章地址</a> </p>
<div style="margin:10px auto;width:500px;height:40px;">
<input type="button" value="父窗口操作iframeA" οnclick="iframeA();" style="width:150px;float:left;"/>
<input type="button" value="将父窗口的h1标签内的代码复制到iframeA中" οnclick="iframeC();" style="float:left;"/>
</div>
<div id="pHello" style="margin:10px auto;width:360px;height:30px;">点击此处可通过iframeB的JavaScript函数，来替换哦~</div>
<div style="margin:10px auto;width:810px;height:300px;">
<iframe id="wIframeA" name="myiframeA" src="iframe_Box.html" scrolling="no" frameborder="0"></iframe>
<iframe id="wIframeB" name="myiframeB" src="iframeB.html" scrolling="no" frameborder="0"></iframe>
</div>

function getIFrameDOM(iID){
return document.getElementById(iID).contentWindow.document;
} //必须先写好这个功能函数