Когда использовать window.opener / window.parent / window.top

94

В JavaScript, когда использовать window.opener/ window.parent/ window.top?

javascript window Шрирам
источник
3
есть также window.self, которое относится к тому же окну :)
CodingOnSteroid

Ответы:

167
  • window.openerотносится к окну, которое вызывалось window.open( ... )для открытия окна, из которого оно вызывается
  • window.parentотносится к родителю окна в <frame>или<iframe>
  • window.topотносится к самому верхнему окну из окна, вложенного в один или несколько слоев <iframe>вложенных окон

Они будут null(или могут быть undefined), когда они не имеют отношения к ситуации ссылающегося окна. («Ссылающееся окно» означает окно, в контексте которого выполняется код JavaScript.)

Заостренный
источник
1
Спасибо @pointy за ответ. У меня есть главная страница, которая открывает дочерний элемент при window.open()отправке страницы. Теперь это дочернее окно открывает другое дочернее окно с тем же window.open()закрытием. Теперь, когда я отправляю своего второго ребенка (первого ребенка больше нет), я хотел бы получить доступ к элементам страницы моей главной страницы. Возможно ли это от второго ребенка, когда первого больше нет?
Шрирам
4
@Sriram: Это та информация, которую вам нужно задать в своем вопросе, чтобы люди знали, какую проблему вы действительно пытаетесь решить.
josh3736
5
@Sriram вам нужно будет захватить, window.opener.openerпрежде чем промежуточная страница исчезнет.
Pointy
24

Я думаю, вам нужно добавить контекст к вашему вопросу. Однако основную информацию об этих вещах можно найти здесь:

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

Я использовал window.opener в основном при открытии нового окна, которое действовало как диалоговое окно, которое требовало ввода данных пользователем и передачи информации обратно в главное окно. Однако это ограничено политикой происхождения, поэтому вам необходимо убедиться, что содержимое диалогового окна и окно открывания загружаются из одного источника.

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

Я использовал это в основном при работе с IFrames, которым необходимо взаимодействовать с объектом окна, который их содержит.

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

Это полезно для обеспечения взаимодействия с окном браузера верхнего уровня. Вы можете использовать его, помимо прочего, для предотвращения использования iframe другим сайтом.

Если вы добавите больше деталей к своему вопросу, я могу привести другие, более подходящие примеры.

ОБНОВЛЕНИЕ: есть несколько способов справиться с ситуацией.
У вас следующая структура:

  • Главное окно
    • Диалог 1
      • Диалог 2 открывается диалогом 1

Когда диалоговое окно 1 запускает код для открытия диалогового окна 2, после создания диалогового окна 2 диалоговое окно 1 должно установить свойство в диалоговом окне 2, которое ссылается на средство открытия диалогового окна 1.

Итак, если "childwindow" - это ваша переменная для объекта окна диалога 2, а "window" - это переменная для объекта окна диалога 1. После открытия диалогового окна 2, но перед закрытием диалогового окна 1 сделайте следующее назначение:

childwindow.appMainWindow = window.opener

После выполнения указанного выше назначения закройте диалоговое окно 1. Затем из кода, запущенного внутри dialog2, вы сможете использовать его window.appMainWindowдля ссылки на главное окно, объект окна.

Надеюсь это поможет.

Марк у рампы51
источник
Спасибо @Mark за ответ. У меня есть главная страница, которая открывает дочерний элемент при window.open()отправке страницы. Теперь это дочернее окно открывает другое дочернее окно с тем же window.open()закрытием. Теперь, когда я отправляю своего второго ребенка (первого ребенка больше нет), я хотел бы получить доступ к элементам страницы моей главной страницы. Возможно ли это от второго ребенка, когда первого больше нет?
Шрирам
обновленный ответ. @ josh3736 - Я не понимаю, насколько этот комментарий полезен. Я никому не советую получать сертификат w3schools. Все здесь знают, как гуглить и получить базовое определение window.opener, window.top и window.parent. Используйте приведенные выше ссылки или найдите новые ссылки, но вряд ли есть смысл дублировать информацию, которая просто определяет эти свойства здесь.
Mark At Ramp51
Объяснение было действительно полезно @ MarkAtRamp51 Спасибо!
Шрирам
3
По ссылке очень подробно объясняется, что не так с w3schools. Смысл в том, чтобы избегать продвижения или ссылки на (и, таким образом, увеличения рейтинга страниц в Google) w3schools в качестве авторитетного источника информации. W3S распространяет неверную информацию, и отчасти проблема заключается в том, что многие люди ссылаются на эту неверную информацию. Лучше было бы ссылаться на более надежный источник информации, такой как MDN .
josh3736
5

top, parent, opener (а также window, self и iframe) - все это объекты окна.

  1. window.opener -> возвращает окно, которое открывает или запускает текущее всплывающее окно.
  2. window.top -> возвращает самое верхнее окно, если вы используете фреймы, это окно набора фреймов, если фреймы не используются, это то же самое, что window или self.
  3. window.parent-> возвращает родительский фрейм текущего фрейма или iframe. Родительский фрейм может быть окном набора фреймов или другим фреймом, если у вас есть вложенные фреймы. Если фреймы не используются, родительский элемент совпадает с текущим окном или самим собой.
Ravish
источник
1

когда вы имеете дело со всплывающими окнами, window.opener играет важную роль, потому что мы должны иметь дело с полями родительской страницы, а также дочерней страницы, когда нам нужно использовать значения на родительской странице, мы можем использовать window.opener или нам нужны некоторые данные в дочернем окне или во всплывающем окне во время загрузки, мы снова можем установить значения с помощью window.opener

Мастер подземелий
источник