[JS] 부모창에서 자식창으로 값 전달

 

부모창에서 자식창으로 값 전달 방법

1. URL 파라미터를 통한 값 전달

부모창

window.open("child.html?data=value");

자식창

var data = new URLSearchParams(window.location.search).get("data");
console.log(data); // "value"

 

 

2. window.opener를 통한 값 전달

부모창

var data = "value";
var childWindow = window.open("child.html");

자식창

window.opener.data = "new value";

 

3. postMessage를 통한 값 전달

부모창

var childWindow = window.open("child.html");

// message event를 수신하는 핸들러
window.addEventListener("message", function(event) {
  console.log(event.data); // "value"
}, false);

자식창

window.opener.postMessage("value", "*");

 

4. localStorage를 통한 값 전달

부모창

localStorage.setItem("data", "value");
var childWindow = window.open("child.html");

자식창

var data = localStorage.getItem("data");
console.log(data); // "value"

 

5. cookie를 통한 값 전달

부모창

document.cookie = "data=value";

자식창

var data = document.cookie.replace(/(?:(?:^|.*;\s*)data\s*\=\s*([^;]*).*$)|^.*$/, "$1");
console.log(data); // "value"

 

 

 

 

출처: https://alisyabob.tistory.com/280

[Javascript] 부모창에서 자식창으로 값 전달