不引入parent_带你走进JavaScript世界系列——top、parent 和 self 对象介绍

如果页面中包含框架，则每个框架都拥有自己的 window 对象，并且保存在 frames 集合中， 在frames 集合中，可以通过索引 或者框架名称来访问相应的 window 对象。每个 window 对象都有一个 name 属性，其中包含框的名称。请看下面一个包含框架的页面：

页面框架结构

上面的代码创建了一个框架集，其中一个框架居中，两个框架居下。对于上面的例子，可以通过 window.frames[0] 或者 window.frames['topFrame'] 来引用上方的框架。不过，最好使用 top 而非 window 来引用这些框架。

top 对象

top 对象始终指向最高(外)层的框架，也就是浏览器窗口。使用它可以确保在一个框架中正确地访问另外一个框架。因为对于在一个框架中编写的任何代码来说，其中的 window 对象指向的都是那个框架的特定实例，而非最高层框架，下图展示了在最高层窗口中，通过代码来访问上面例子中每个框架的不同方式：

通过代码访问上面例子中每个框架的不同方式

parent 对象

与 top 相对另一个 window 对象是 parent。parent 对象始终指向当前框架的 直接上层框架。在某些情况下，parent 有可能等于 top；在没有框架的情况下，parent 一定等于 top (此时它们都等于 window)。请看下面的例子：

anotherframe2.htm

在浏览器加载完第一个框架后，会继续将第二个框架加载到 rightFrame 中。如果代码位于 redFrame (或 blueFrame )中，那么 parent 对象指向的就是 rightFrame。如果代码位于 topFrame 中 ，则 parent 指向的是 top ，因为 topFrame 的直接上层框架就是最外层框架。

注意，除非最外层窗口是通过 window.open() 打开的，否则其 window 对象的 name 属性不会包含任何值。

self 对象

与框架有关的最后一个对象是 self ，它始终指向 window 。实际上，self 和 window 对象是可以互换使用的。引入 self 对象的目的就是为了与 top 和 parent 对象对应起来，因此它不格外包含其他值。