重走JAVA编程路：Js中self,top,parent,opener详解，傻傻分不清楚

昨天项目遇到的问题：取上级window窗口对象时，傻傻分不清楚！你能分清楚吗？

 

当我们在浏览器中打开一个网页时，浏览器都会创建一个窗口对象，这个窗口就是一个window对象。也就是Js生存依附的全局环境对象和全局作用域对象。

1.Self 指当前窗口页面，就是window对象

例如：Self.close()和window.close()一样。

 

2.Top表示最顶层的一个窗口页面

最顶层页面===》父页面===》子页面，self.top就代表其中的最顶层页面，相当于子页面的祖父。

self.top 等于self.parent.parent

 

3.Parent在进行父页面访问时使用

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

4.Opener在进行父页面引用时使用

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

window.opener.location.reload(); //子窗口刷新父窗口
window.opener.location.href //获取父窗口href
window.opener.locaiton.pathname //获取父窗口路径名
//刷新父页面
window.location.href=window.location.href ; //重新定位父页面
window.location.reload;

 

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

如下： parent.frame1.document.forms[0].elements[0].value; 

拓展：jquery获取父窗口的元素

取父窗口的元素方法：$(selector, window.parent.document);

 

("#父窗口元素ID",window.parent.document); 对应javascript的代码：window.parent.document.getElementByIdx_x("父窗口元素ID")；