Kiedy używać window.opener / window.parent / window.top

94

Kiedy w JavaScript używać window.opener/ window.parent/ window.top?

javascript window Sriram
źródło
3
istnieje również window.self, które odnosi się do tego samego okna :)
CodingOnSteroid

Odpowiedzi:

167
  • window.openerodnosi się do okna, które wywołało window.open( ... )otwarcie okna, z którego zostało wywołane
  • window.parentodnosi się do rodzica okna w <frame>lub<iframe>
  • window.topodnosi się do okna znajdującego się najwyżej w oknie zagnieżdżonym w jednej lub kilku warstwach <iframe>okien podrzędnych

Będą null(a może undefined) wtedy, gdy nie będą miały związku z sytuacją w oknie odsyłającym. („Okno odwołujące się” oznacza okno, w którym jest uruchamiany kod JavaScript.)

Spiczasty
źródło
1
Dzięki @pointy za odpowiedź. Mam stronę główną, która otwiera dziecko za pomocą window.open()po przesłaniu strony. Teraz to okno potomne otwiera kolejne okno podrzędne z tym samym window.open()zamykającym się ja. Teraz, kiedy zgłaszam moje drugie dziecko (pierwszego dziecka już nie ma), chciałbym uzyskać dostęp do elementów mojej strony głównej. Czy jest to możliwe od drugiego dziecka, gdy pierwszego już nie ma?
Sriram,
4
@Sriram: To rodzaj informacji, które musisz umieścić w swoim pytaniu, aby ludzie wiedzieli, jaki problem naprawdę próbujesz rozwiązać.
josh3736
5
@Sriram będziesz musiał złapać, window.opener.openerzanim strona pośrednia zniknie.
Pointy,
24

Myślę, że musisz dodać kontekst do swojego pytania. Jednak podstawowe informacje o tych rzeczach można znaleźć tutaj:

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

Użyłem window.opener głównie podczas otwierania nowego okna, które działało jak okno dialogowe, które wymagało wprowadzenia danych przez użytkownika i musiało przekazać informacje z powrotem do okna głównego. Jest to jednak ograniczone przez zasady pochodzenia, więc musisz upewnić się, że zarówno zawartość okna dialogowego, jak i okna otwierającego są ładowane z tego samego źródła.

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

Używałem tego głównie podczas pracy z ramkami iFrame, które muszą komunikować się z obiektem okna, który je zawiera.

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

Jest to przydatne, aby zapewnić interakcję z oknem przeglądarki najwyższego poziomu. Możesz go użyć między innymi do zapobiegania ramkowaniu Twojej witryny przez inną witrynę.

Jeśli dodasz więcej szczegółów do swojego pytania, mogę podać inne, bardziej odpowiednie przykłady.

AKTUALIZACJA: Istnieje kilka sposobów radzenia sobie z sytuacją.
Masz następującą strukturę:

  • Główne okno
    • Okno dialogowe 1
      • Okno dialogowe 2 otwierane przez okno dialogowe 1

Gdy okno dialogowe 1 uruchamia kod otwierający okno dialogowe 2, po utworzeniu okna dialogowego 2 należy ustawić w oknie dialogowym 1 właściwość, która odwołuje się do otwieracza Dialog1.

Więc jeśli „childwindow” jest zmienną dla obiektu okna dialog 2, a „window” jest zmienną dla obiektu okna Dialog 1. Po otwarciu okna dialogowego 2, ale przed zamknięciem okna 1, wykonaj przypisanie podobne do tego:

childwindow.appMainWindow = window.opener

Po wykonaniu powyższego przypisania zamknij okno dialogowe 1. Następnie z kodu działającego wewnątrz okna dialog2 powinieneś móc użyć window.appMainWindowodniesienia do głównego okna, obiektu okna.

Mam nadzieję że to pomoże.

Znak na rampie51
źródło
Dzięki @Mark za odpowiedź. Mam stronę główną, która otwiera dziecko za pomocą window.open()po przesłaniu strony. Teraz to okno potomne otwiera kolejne okno podrzędne z tym samym window.open()zamykającym się ja. Teraz, kiedy zgłaszam moje drugie dziecko (pierwszego dziecka już nie ma), chciałbym uzyskać dostęp do elementów mojej strony głównej. Czy jest to możliwe od drugiego dziecka, gdy pierwszego już nie ma?
Sriram,
zaktualizowana odpowiedź. @ josh3736 - Nie widzę, jak ten komentarz jest pomocny. Nie radzę nikomu zdobyć certyfikatu w3schools. Każdy tutaj wie, jak znaleźć w Google i uzyskać podstawową definicję window.opener, window.top i window.parent. Skorzystaj z powyższych linków lub znajdź nowe odniesienia, ale nie ma prawie sensu powielanie informacji, które po prostu definiują te właściwości tutaj.
Mark At Ramp51
Wyjaśnienie było naprawdę pomocne @ MarkAtRamp51 Dzięki!
Sriram
3
Link wyjaśnia - bardzo szczegółowo - co jest nie tak z w3schools. Chodzi o to, aby unikać promowania lub linkowania do (a tym samym zwiększania Google PageRank) w3schools jako wiarygodnego źródła informacji. W3S rozpowszechnia złe informacje, a część problemu polega na tym, że tak wiele osób odwołuje się do tych złych informacji. Lepiej byłoby połączyć się z bardziej wiarygodnym źródłem informacji, takim jak MDN .
josh3736
5

top, parent, opener (a także window, self i iframe) to wszystkie obiekty okna.

  1. window.opener -> zwraca okno, które otwiera lub uruchamia bieżące okno podręczne.
  2. window.top -> zwraca najwyższe okno, jeśli używasz ramek, jest to okno zestawu ramek, jeśli nie używasz ramek, jest to to samo, co okno lub self.
  3. window.parent-> zwraca ramkę nadrzędną bieżącej ramki lub ramki iframe. Ramką nadrzędną może być okno zestawu ramek lub inna ramka, jeśli masz ramki zagnieżdżone. Jeśli nie używasz ramek, rodzic jest tym samym, co bieżące okno lub własne
Oczarować
źródło
1

gdy masz do czynienia z wyskakującymi okienkami window.opener odgrywa ważną rolę, ponieważ mamy do czynienia z polami strony nadrzędnej i podrzędnej, gdy musimy użyć wartości na stronie nadrzędnej, możemy użyć window.opener lub potrzebujemy danych w oknie potomnym lub wyskakującym okienku w momencie ładowania możemy ponownie ustawić wartości za pomocą window.opener

Mistrz lochu
źródło