[javascript] window.opener / window.parent / window.top을 사용하는 경우

JavaScript에서 언제 window.opener/ window.parent/ window.top?



답변

  • window.opener호출 된 창 window.open( ... )을 열기 위해 호출 한 창을 나타냅니다.
  • window.parent<frame>또는 에서 창의 부모를 나타냅니다.<iframe>
  • window.top하나 이상의 <iframe>하위 창 레이어에 중첩 된 창에서 맨 위 창을 나타냅니다.

사람들은있을 것이다 null(또는 어쩌면 undefined그들은 참조 윈도우의 상황과 관련이 없을 때). ( “참조 창”은 JavaScript 코드가 실행되는 컨텍스트의 창을 의미합니다.)


답변

질문에 컨텍스트를 추가해야한다고 생각합니다. 그러나 이러한 사항에 대한 기본 정보는 여기에서 찾을 수 있습니다.

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

필자는이를 포함하는 창 개체와 통신해야하는 IFrame으로 작업 할 때 주로 이것을 사용했습니다.

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

이는 최상위 브라우저 창과 상호 작용할 때 유용합니다. 다른 사이트가 귀하의 웹 사이트를 iframing하는 것을 방지하는 데 사용할 수 있습니다.

질문에 좀 더 자세한 내용을 추가하면 더 관련성이 높은 다른 예를 제공 할 수 있습니다.

업데이트 :
상황을 처리 할 수있는 몇 가지 방법이 있습니다.
다음과 같은 구조가 있습니다.

  • 메인 창
    • 대화 1
      • 대화 상자 2에 의해 열린 대화 상자 1

Dialog 1이 Dialog 2를 여는 코드를 실행할 때 Dialog 2를 생성 한 후 Dialog 1이 Dialog1 오프너를 참조하는 Dialog 2의 속성을 설정하도록합니다.

따라서 “childwindow”가 대화 상자 2 창 개체에 대한 변수이고 “window”가 대화 상자 1 창 개체에 대한 변수 인 경우. 대화 상자 2를 연 후 대화 상자 1을 닫기 전에 다음과 유사한 할당을합니다.

childwindow.appMainWindow = window.opener

위와 같이 할당 한 후 대화 상자 1을 닫습니다. 대화 상자 2 내부에서 실행되는 코드에서 메인 창인 window.appMainWindow창 개체를 참조하는 데 사용할 수 있어야
합니다.

도움이 되었기를 바랍니다.


답변

top, parent, opener (및 window, self 및 iframe)는 모두 창 개체입니다.

  1. window.opener -> 현재 팝업 창을 열거 나 실행하는 창을 반환합니다.
  2. window.top -> 프레임을 사용하는 경우 최상위 창을 반환합니다. 프레임을 사용하지 않는 경우에는 window 또는 self와 동일합니다.
  3. window.parent-> 현재 프레임 또는 iframe의 부모 프레임을 반환합니다. 상위 프레임은 프레임 세트 창이거나 중첩 된 프레임이있는 경우 다른 프레임 일 수 있습니다. 프레임을 사용하지 않는 경우 부모는 현재 창 또는 자체와 동일합니다.


답변

팝업을 다룰 때 window.opener가 중요한 역할을합니다. 우리는 부모 페이지와 자식 페이지의 필드를 다뤄야하기 때문에 부모 페이지에서 값을 사용해야 할 때 window.opener를 사용하거나 데이터를 원합니다. 로드 할 때 자식 창이나 팝업 창에서 다시 window.opener를 사용하여 값을 설정할 수 있습니다.


답변