[DOM,Javascript] 자식창과 부모창 관계(호출), iframe과 메인페이지 관계(호출)

javascript 에서 새로 띄운 자식창과 부모창, iframe 내부와 메인페이지간의 제어 방법에 대한

 

다양한 예제를 학습해본다.

 

 

 

1. 자식창에서 부모창의 특정 Form 에 데이터를 집어넣고 싶을 때

 

자식창에서 부모창을 가리킬 때 opener 객체를 사용한다. document.Form.input 은 부모창에

 

속해있는 요소이다. (자바스크립트 함수 호출 도 opener를 사용하면 된다!)

 

opener.document.Form.input.value = “값”;

 

 

 

2. 자식창에서 부모창의 페이지를 이동시키고 싶을 때

 

부모창을 원하는 페이지로 이동시킨후 자식창(자기자신) 은 닫는다.

 

window.opener.location.href = “/admin/login.jsp” ;

 

window.close();

 

 

3. 자식창에서 부모창을 새로고침하고 싶을 때

 

if (!opener.closed){

 

opener.document.location.reload();

 

window.close();

 

}

 

 

4. iframe 내부에서 외부에 있는 메인페이지의 특정 Form 에 값을 집어넣고 싶을 때

 

iframe 에서 메인을 가리킬때는 parent 객체로 접근한다.(자바스크립트 함수 호출 도 parent를 사용하면 된다!)

 

parent.Form.input.value = “값”;

 

 

5. iframe 내부에서 외부에 있는 메인페이지의 스크립트 함수를 실행하고자 할 때

 

parent.[메인함수명]

 

parent.DoSend();

 

 

 

6. 메인에서 iframe 의 페이지를 이동시키고 싶을 때

 

[iframe 이름].location.href

 

frame.location.href=”www.naver.com”;

 

<iframe name=”frame”>

 

####

 

</iframe>

 

 

7. 위의 2가지 경우를 섞은것이다. 부모창의 iframe 에서 새창을 하나 띄웠다.

 

자식창에서 부모창의 페이지를 이동하고 싶은것이다.

 

이것은 부모창의 iframe 에 갔다가 메인으로 다시 이동해야한다.

 

2가지의 방법이 있는데 첫번째는 window.opener 를 호출하여 iframe으로간뒤

 

parent 로 메인에 접근한다.

 

window.opener.parent.location.href = “URL”;

 

 

두번째는 top 을 이용해서 부모창을 바로 찾는것이다

 

top.opener.location.href = “URL”;

출처를 잘 모르겠네요. 문제가 된다면 쪽지주세요. 바로 삭제하겠습니다.