子框架怎样修改父框架的层属性？解决思路-JavaSript-爱易网页

子框架怎样修改父框架的层属性？解决思路

日期：2014-05-16　浏览次数：20489 次

子框架怎样修改父框架的层属性？
就是mainFrame里面的层属性设为隐藏，鼠标经过topFrame框架的文字时mainFrame里的层显示出来。
请确认调试成功了再回复！有全代码最好，我是新手！

------解决方案--------------------
frame.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>

<frameset rows="80,*" frameborder="no" border="0" framespacing="0">
<frame src="top.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" />
<frame src="main.html" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset>
<noframes><body>
</body>
</noframes></html>

top.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript">
function showdiv(){
////parent代表父窗口，mainFrame是另外一个框架名称，如果是父窗口的内容则不需要这个
parent.mainFrame.checkDiv.style.display="inline";
}
function hidden(){
parent.mainFrame.checkDiv.style.display="none";
}
</script>
<body>
<a href="#" onmouseover="showdiv()">显示层</a>
</body>
</html>

main.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<style>
div{
width:200px;
height:200px;
border:1px;
border-color:#000000;
background:#CCCCCC;
color:#FF0000;
display:none;}

</style>
<body>
<div id="checkDiv" name="checkDiv">
需要显示的层
</div>
</body>
</html>
------解决方案--------------------
使用parent关键字加iframe的名字就可以操作到父页面中其余iframe中的dom元素
------解决方案--------------------
dom.parent()//为父节点
------解决方案--------------------
document.parent.***.style.display="";
------解决方案--------------------
window.parent.mainFrame.document.getElementById("div1").style.display="block"

试试
------解决方案--------------------

HTML code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>测试</title>
<style>
#mainFrame{
    width:200px;
    height:200px;
    margin-top:200px;
    margin-left:200px;
    background-color:#CCC;
    border:1px solid red;
    display:none;
    position:absolute;
    z-index:1000;
}
</style>
&l

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

子框架怎样修改父框架的层属性？解决思路

相关资料更多>

推荐阅读更多>