js中parent和opener的区别

更多时间：2013-12-25 类别：Web前端浏览量：4161

js中parent和opener的区别

js中parent和opener的区别

opener

opener用于在window.open的页面引用执行该window.open方法的的页面的对象。例如：A页面通过window.open()方法弹出了B页面，在B页面中就可以通过opener来引用A页面，这样就可以通过这个对象来对A页面进行操作。

parent

parent用于在iframe,frame中生成的子页面中访问父页面的对象。例如：A页面中有一个iframe或frame，那么iframe或frame中的页面就可以通过parent对象来引用A页面中的对象。这样就可以获取或返回值到A页面中。

parent指父窗口，在FRAMESET中，FRAME的PARENT就是FRAMESET窗口。 opener指用WINDOW.OPEN等方式创建的新窗口对应的原窗口。两者肯定不一样。

parent是相对于框架来说父窗口对象 opener是针对于用window.open打开的窗口来说的父窗口，前提是window.open打开的才有。

实例介绍

window.parent

a页面

HTML 代码复制


<html>
<head><title>主页面</title></head>
<body>
<form name="form1" id="form1"><input type="text" name="username" id="username"/></form>
<iframe src="b页面" width=100%></iframe>
</body>
</html>

b页面

HTML 代码复制


<html>
<head><title></title>
<script type="text/javascript">...function UpdateParent()
...{

var _parentWin = window.parent ;

_parentWin.form1.username.value = "xxxx" ;

} 
</script>
</head>
<body>
<form name="form1" id="form1">
<p>&nbsp; </p>
<p align="center">
    <input type="button" name="button" id="button" value="更新主页面的UserName内容" onClick="UpdateParent();">
</p>
<p>&nbsp; </p>
</form></body>
</html>

window.opener

a页面

HTML 代码复制


<html>
<head>
<title>主页面</title>
<script type="text/javascript">...
function openSubWin()
...{var _width = 300 ;

var _height = 200 ;var _left = (screen.width - _width) / 2 ;
  
var _top = (screen.height - _height) / 2 ;
  
window.open("b页面",null,
"height=" + _height + ",width=" + _width + ",status=no,toolbar=no,menubar=no,location=no,resizable=yes,left=" + _left + ",top=" + _top);
}
</script>
</head>
<body><form name="form1" id="form1"><input type="text" name="username" id="username"/><input type="button" value="弹出子页面" onClick="openSubWin();"></form></body>
</html>

b页面

HTML 代码复制


<html>
<head>
<title>子页面</title>
<script type="text/javascript">...function UpdateParent()
...{

var _parentWin = window.opener ;

_parentWin.form1.username.value = "xxxx" ;

} 
</script>
</head>
<body>
<form name="form1" id="form1">
<p>&nbsp; </p>
<p align="center">
    <input type="button" name="button" id="button" value="更新主页面的UserName内容" onClick="UpdateParent();">
</p>
<p>&nbsp; </p>
</form>
</body>
</html>

标签：javascript window.parent window.opener

上一篇：$(document).ready和window.onload的区别

下一篇：asp.net文件下载的方法

您可能感兴趣

js中parent和opener的区别

js中parent和opener的区别

热门推荐

排行榜