window.parent与window.opener的区别

如题两种方法都是javascript调用父窗口的方法。

 

1、window.parent是iframe页面调用父窗口对象

比如：a.html

< html >    
< head > < title >父页面 </title> </head>    
< body >    
< form name ="form1" id ="form1" >    

< input type ="text" name ="username" id ="username" />    

</form>    
< iframe src ="b.html" width=100% > </iframe>    
</body>    
</html>    

当要在b.html中对a.html页面的username文本框赋值时，在b.html中应该这样写：

b.html：

<script type= "text/javascript">    
var _parentWin = window.parent ;    
_parentWin.form1.username.value = "xxxx" ;    
</script>

 

2、window.opener是window.open打开的子页面调用父页面对象

比如：a.html

<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.html", null,    
"height=" + _height + ",width=" + _width + ",status=no,toolbar=no,menubar=no,location=no,resizable=yes,left=" + _left + ",top=" + _top);    
}    
</script>    
<input type= "text" name= "username" id= "username"/>    
<input type= "button" value= "弹出子页面" onClick= "openSubWin();">    

当要在b.html中对a.html页面的username文本框赋值时，在b.html中应该这样写：

b.html：

<script type= "text/javascript">        
function UpdateParent()        
{        
var _parentWin = window.opener ;        
_parentWin.form1.username.value = "xxxx" ;        
//或者：window.opener.document.getElementById("username").value = "xxxx";
}        
</script>        
<input type= "button" name= "button" id= "button" value= "更新主页面的UserName内容" onClick= "javascript:UpdateParent();">        

 

总结：

window.parent中parent表示父窗口，比如一个A页面利用iframe或frame调用B页面，那么A页面就是B页面的parent。B页面可以通过parent访问A页面。

 

window.opener中的opener表示谁打开我的，比如一个A页面利用window.open弹出了B页面，那么A页面就是B页面的opener。B页面可以通过opener访问A页面。