[JavaScript] 자식창에서 부모창의 변수 이용하기

window.open 기능을 이용하여 자식창을 연 다음 자식창에서 부모창의 변수를 이용할 수 있다.

자식창을 연 다음 자식창으로 이동하고 개발자도구를 열고 opener를 입력해보면 확인할 수 있다.

부모창에서 선언한 함수도 이용할 수 있다.

함수에 포함된 alert나 console.log 등의 동작은 자식창이 아닌 부모창에서 실행되는 것을 볼 수 있다.

 

// 부모창 콘솔에 입력
var a = "123"
var b = function(msg) {alert('message test ' + msg);};
var c = function(num) {
	console.log('입력값: ', num);
    return num * num;
};
var childWindow = window.open();
console.log(childWindow.opener.a); // "123"

// 자식창 콘솔에 입력
console.log(opener.a) // "123"
opener.b('hi'); // 부모창에 alert가 뜬다.
var s = opener.c(3); // 부모창 콘솔에 '입력값: 3'이 찍힌다.
console.log(s); // 9