javascript宿主对象之window.frames

Posted 2020-08-07

window.frames属性是当前页面所有框架的集合。要注意的事，这里并没有frame和iframe做出区分。而且，无论页面存不存在框架，window.frames属性总是存在的，并总是指向window对象本身。

window.frames === window; // true;

假设我们页面中有一个iframe元素：

<iframe name="myframe" src="hello.html"/>

我们可以通过检查其length属性来了解页面中是否存在frame元素。

frames.length; // 1

如果想访问iframe元素的window对象，可以选择下面方法中的任何一种：

window.frames[0];
window.frames[0].window;
window frames[0].window.frames;
frames[0].window;
frames[0];

 通过父级页面，我们可以访问子frame元素的属性。例如可有通过下面方式进行iframe元素的重载。

frames[0].window.location.reload();

 同样的我们可以通过子元素来访问父级页面。

frames[0].parent === window

我们可以通过一个叫做top属性可以访问到最顶层的页面：

window.frames[0].window.top === window; // true
window.frames[0].window.top === window.top; // true
window.frames[0].window.top === top; // true;

除此之外还有一个self属性，它的作用与window基本相同。

self === window; // true
frames[0].self == frames[0].window; //true

 如果frame元素拥有name属性，我们就可以丢开索引，转而通过name属性的值来访问该frame；

window.frames[‘myframe‘] === window.frames[0];  // true

 或者这样也可以：

frames.myframe === window.frames[0]; // true