Objeto window de Javascript

En Javascript, digamos que tenemos una página principal ( main.html ) que contiene un <iframe> ( iframe.html )

Ahora dentro de este iframe.html , si necesitamos referirnos a algo en la página principal ( main.html ), ¿no podemos simplemente especificar window lugar de parent.window

Si la respuesta es que necesitamos escribir parent.window , quería entender que no hay una sola reference de object de window para todos los iframes dentro de una página principal.

Si bien entiendo que el document es específico para iframes individuales, pero la window debería ser común a todos … No lo es … Por favor, ayúdenme a comprender el concepto …

También hay algo window.parent también? Si es así, ¿cómo difiere de parent.window ?

El concepto de window está vinculado al document : hay una window por document y un document por window .

Eso significa que los elementos <iframe> , que tienen su propio document , también tienen su propia window , al igual que una window emergente o la window principal del browser.

Entonces, de hecho tendrá que usar window.parent para acceder al contenedor de un elemento <iframe> , del mismo modo que tiene que usar window.opener para acceder al propietario de una window emergente.

EDITAR: Tanto window.parent como parent.window son expresiones válidas que devuelven el mismo object. Esto se debe a que el object window es el context pnetworkingeterminado en la creación de scripts (los nombres no calificados se analizan como miembros de la window ) y window objects window tienen una propiedad de window que se refiere a ellos mismos.

Entonces, parent.window se evalúa como window.parent.window , que es el mismo object que window.parent .

Dicho esto, prefiero usar window.parent , para evitar la sobrecarga (mínima) asociada con el acceso a la propiedad adicional.

iframe s (y frame s) son sus propias windows, aunque en el caso de iframe s parezcan parte de la window del documento principal. Así que sí, para referirse a la window del documento principal, usarían parent (o window.parent si quieres ser detallado, pero claro), porque son objects separados. Esto es parcialmente necesario porque muchas de las cosas en el document terminan como properties en la window que lo contiene.

Si lo piensas bien, tiene sentido: el objective de un iframe es include contenido de origen independiente dentro de la página. Si la página principal y los iframe (s) en ella compartían un solo object de window , compartirían el context global, y muy posiblemente entrarían en conflicto uno con el otro.

Ejemplo en vivo gratuito:

HTML de los padres:

 <p>I'm the parent window</p> <iframe width="500" height="500" src="http://jsbin.com/iyogir"></iframe> 

JavaScript de los padres:

 function foo() { display("<code>foo</code> called!"); } function display(msg) { var p = document.createElement('p'); p.innerHTML = msg; document.body.appendChild(p); } 

HTML del niño:

 <p>I'm in the frame</p> <input type='button' id='theButton' value='Click Me'> 

JavaScript del niño:

 window.onload = function() { document.getElementById('theButton').onclick = function() { var p = window.parent; if (!p) { display("Can't find parent window"); } else if (typeof p.foo !== "function") { display("Found parent window, but can't find <code>foo</code> function on it"); } else { display("Calling parent window's <code>foo</code> function."); p.foo(); } }; function display(msg) { var p = document.createElement('p'); p.innerHTML = msg; document.body.appendChild(p); } };