Quando usar window.opener / window.parent / window.top

92

Em JavaScript, quando usar window.opener/ window.parent/ window.top?

Sriram
fonte
3
há também um window.self que se refere à mesma janela :)
CodingOnSteroid

Respostas:

163
  • window.openerrefere-se à janela que chamou window.open( ... )para abrir a janela da qual é chamado
  • window.parentrefere-se ao pai de uma janela em um <frame>ou<iframe>
  • window.toprefere-se a-topo mais a janela a partir de uma janela aninhado em uma ou mais camadas de <iframe>sub-janelas

Esses serão null(ou talvez undefined) quando não forem relevantes para a situação da janela de referência. ("Janela de referência" significa a janela em cujo contexto o código JavaScript é executado.)

Pontudo
fonte
1
Obrigado @pointy pela resposta. Eu tenho uma página principal que abre uma criança usando window.open()ao enviar a página. Agora, esta janela-filha abre outra janela-filha com o mesmo window.open()self de fechamento. Agora, quando eu enviar meu segundo filho (o primeiro filho não existe mais), gostaria de acessar os elementos da página da minha página principal. Isso é possível a partir do segundo filho, quando o primeiro não está mais presente?
Sriram
4
@Sriram: Esse é o tipo de informação que você precisa colocar em sua pergunta, para que as pessoas saibam qual problema você está realmente tentando resolver.
josh3736
5
@Sriram você terá que pegar window.opener.openerantes que a página intermediária vá embora.
Pointy
23

Acho que você precisa adicionar algum contexto à sua pergunta. No entanto, informações básicas sobre essas coisas podem ser encontradas aqui:

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

Usei window.opener principalmente ao abrir uma nova janela que funcionava como um diálogo que exigia a entrada do usuário e precisava passar informações de volta para a janela principal. No entanto, isso é restrito pela política de origem, então você precisa garantir que o conteúdo da caixa de diálogo e a janela do abridor sejam carregados da mesma origem.

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

Usei isso principalmente ao trabalhar com IFrames que precisam se comunicar com o objeto de janela que os contém.

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

Isso é útil para garantir que você esteja interagindo com a janela do navegador de nível superior. Você pode usá-lo para impedir que outro site crie iframe para seu site, entre outras coisas.

Se você adicionar mais detalhes à sua pergunta, posso fornecer outros exemplos mais relevantes.

ATUALIZAÇÃO: Existem algumas maneiras de lidar com sua situação.
Você tem a seguinte estrutura:

  • Janela principal
    • Diálogo 1
      • Diálogo 2 aberto pelo diálogo 1

Quando o Dialog 1 executa o código para abrir o Dialog 2, depois de criar o Dialog 2, faça com que o diálogo 1 defina uma propriedade no Dialog 2 que faz referência ao abridor Dialog1.

Portanto, se "childwindow" é sua variável para o objeto de janela de diálogo 2, e "janela" é a variável para o objeto de janela de diálogo 1. Depois de abrir a caixa de diálogo 2, mas antes de fechar a caixa de diálogo 1, faça uma atribuição semelhante a esta:

childwindow.appMainWindow = window.opener

Depois de fazer a atribuição acima, feche a caixa de diálogo 1. A partir do código em execução na caixa de diálogo 2, você deve ser capaz de usar window.appMainWindowpara fazer referência à janela principal, objeto de janela.

Espero que isto ajude.

Mark At Ramp51
fonte
Obrigado @Mark pela resposta. Tenho uma página principal que abre uma criança usando window.open()ao enviar a página. Agora, esta janela-filha abre outra janela-filha com o mesmo window.open()self de fechamento. Agora, quando eu enviar meu segundo filho (o primeiro filho não existe mais), gostaria de acessar os elementos da página da minha página principal. Isso é possível a partir do segundo filho, quando o primeiro não está mais presente?
Sriram
resposta atualizada. @ josh3736 - Não vejo como esse comentário seja útil. Não estou aconselhando ninguém a obter uma certificação w3schools. Todos aqui sabem como pesquisar no Google e obter a definição básica de window.opener, window.top e window.parent. Use os links acima ou encontre novas referências, mas dificilmente há sentido em duplicar as informações que simplesmente definem essas propriedades aqui.
Mark At Ramp51
A explicação foi muito útil @ MarkAtRamp51 Obrigado!
Sriram
3
O link explica - em grande detalhe - o que há de errado com w3schools. O objetivo é evitar promover ou criar links para (e, assim, aumentar o Google PageRank das) w3schools como uma fonte confiável de informações. O W3S espalha informações ruins, e parte do problema é que muitas pessoas se conectam a essas informações ruins. Melhor seria vincular-se a uma fonte de informações mais confiável, como o MDN .
josh3736
5

top, parent, opener (bem como window, self e iframe) são todos objetos de janela.

  1. window.opener -> retorna a janela que abre ou lança a janela pop-up atual.
  2. window.top -> retorna a janela superior, se você estiver usando frames, esta é a janela do frameset, se não estiver usando frames, é o mesmo que window ou self.
  3. window.parent-> retorna o quadro pai do quadro ou iframe atual. O quadro pai pode ser a janela do conjunto de quadros ou outro quadro, se houver quadros aninhados. Se não estiver usando frames, o pai é o mesmo que a janela atual ou self
Ravish
fonte
1

quando você está lidando com pop-ups, window.opener desempenha um papel importante, porque temos que lidar com campos da página pai e também da página filha, quando temos que usar valores na página pai podemos usar window.opener ou queremos alguns dados na janela filha ou janela pop-up no momento do carregamento, então, novamente, podemos definir os valores usando window.opener

Mestre da Masmorra
fonte