Cuándo usar window.opener / window.parent / window.top


94

En JavaScript, ¿cuándo usar window.opener/ window.parent/ window.top?


3
también hay una ventana.auto que se refiere a la misma ventana :)
CodingOnSteroid

Respuestas:


167
  • window.openerse refiere a la ventana que llamó window.open( ... )para abrir la ventana desde la que se llama
  • window.parentse refiere al padre de una ventana en una <frame>o<iframe>
  • window.topse refiere a la parte superior-más ventana de una ventana anidado en una o más capas de <iframe>sub-ventanas

Esos serán null(o tal vez undefined) cuando no sean relevantes para la situación de la ventana de referencia. ("Ventana de referencia" significa la ventana en cuyo contexto se ejecuta el código JavaScript).


1
Gracias @pointy por la respuesta. Tengo una página principal que abre a un niño window.open()al enviar la página. Ahora esta ventana secundaria abre otra ventana secundaria con el mismo window.open()yo de cierre. Ahora, cuando envíe mi segundo hijo (el primer hijo ya no existe), me gustaría acceder a los elementos de la página de mi página principal. ¿Es esto posible a partir del segundo hijo cuando el primero ya no está presente?
Sriram

4
@Sriram: Ese es el tipo de información que debe incluir en su pregunta, para que la gente sepa qué problema está realmente tratando de resolver.
josh3736

5
@Sriram tendrás que agarrar window.opener.openerantes de que desaparezca la página intermedia.
Puntiagudo

24

Creo que necesitas agregar algo de contexto a tu pregunta. Sin embargo, aquí se puede encontrar información básica sobre estas cosas:

window.opener https://developer.mozilla.org/en-US/docs/Web/API/Window.opener

He usado window.opener principalmente al abrir una nueva ventana que actuaba como un cuadro de diálogo que requería la entrada del usuario y necesitaba pasar información a la ventana principal. Sin embargo, esto está restringido por la política de origen, por lo que debe asegurarse de que tanto el contenido del cuadro de diálogo como la ventana de apertura se carguen desde el mismo origen.

window.parent https://developer.mozilla.org/en-US/docs/Web/API/Window.parent

He usado esto principalmente cuando trabajo con IFrames que necesitan comunicarse con el objeto de ventana que los contiene.

window.top https://developer.mozilla.org/en-US/docs/Web/API/Window.top

Esto es útil para asegurarse de que está interactuando con la ventana del navegador de nivel superior. Puede usarlo para evitar que otro sitio enmarque su sitio web, entre otras cosas.

Si agrega más detalles a su pregunta, puedo proporcionar otros ejemplos más relevantes.

ACTUALIZACIÓN: Hay algunas formas en que puede manejar su situación.
Tienes la siguiente estructura:

  • Ventana principal
    • Diálogo 1
      • Diálogo 2 Abierto por Diálogo 1

Cuando Dialog 1 ejecuta el código para abrir Dialog 2, después de crear Dialog 2, haga que dialog 1 establezca una propiedad en Dialog 2 que haga referencia al abridor Dialog1.

Entonces, si "childwindow" es su variable para el objeto de ventana de diálogo 2, y "ventana" es la variable para el objeto de ventana de diálogo 1. Después de abrir el cuadro de diálogo 2, pero antes de cerrar el cuadro de diálogo 1, realice una asignación similar a esta:

childwindow.appMainWindow = window.opener

Después de realizar la asignación anterior, cierre el cuadro de diálogo 1. Luego, desde el código que se ejecuta dentro de dialog2, debería poder usar window.appMainWindowpara hacer referencia a la ventana principal, el objeto de ventana.

Espero que esto ayude.


Gracias @Mark por la respuesta. Tengo una página principal que abre a un niño window.open()al enviar la página. Ahora esta ventana secundaria abre otra ventana secundaria con el mismo window.open()yo de cierre. Ahora, cuando envíe mi segundo hijo (el primer hijo ya no existe), me gustaría acceder a los elementos de la página de mi página principal. ¿Es esto posible a partir del segundo hijo cuando el primero ya no está presente?
Sriram

respuesta actualizada. @ josh3736 - No veo cómo ese comentario es útil. No estoy aconsejando a nadie que obtenga una certificación de w3schools. Todos aquí saben cómo buscar en Google y obtener la definición básica de window.opener, window.top y window.parent. Utilice los enlaces de arriba o busque nuevas referencias, pero no tiene sentido duplicar la información que simplemente define estas propiedades aquí.
Mark At Ramp51

La explicación fue realmente útil @ MarkAtRamp51 ¡Gracias!
Sriram

3
El enlace explica, con gran detalle, lo que está mal con w3schools. El punto es evitar promocionar o vincular a (y así aumentar el PageRank de Google) w3schools como una fuente autorizada de información. W3S difunde información errónea y parte del problema es que muchas personas enlazan esa información errónea. Mejor sería vincularlo a una fuente de información más confiable, como MDN .
josh3736

5

top, parent, abridor (así como window, self e iframe) son todos objetos de ventana.

  1. window.opener -> devuelve la ventana que abre o lanza la ventana emergente actual.
  2. window.top -> devuelve la ventana superior, si está usando marcos, esta es la ventana del conjunto de marcos, si no usa marcos, es lo mismo que window o self.
  3. window.parent-> devuelve el marco principal del marco actual o iframe. El marco principal puede ser la ventana del conjunto de marcos u otro marco si tiene marcos anidados. Si no usa marcos, padre es el mismo que la ventana actual o auto

1

cuando se trata de ventanas emergentes, window.opener juega un papel importante, porque tenemos que lidiar con los campos de la página principal y la página secundaria, cuando tenemos que usar valores en la página principal, podemos usar window.opener o queremos algunos datos en la ventana secundaria o ventana emergente en el momento de la carga, nuevamente podemos establecer los valores usando window.opener

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.