[문제해결] IE 부모창, 팝업창 appendChild ERROR

1. 문제발생

IE에서 동적으로 노드를 생성하여 서로 다른 창에서 append를 할 수 없게 되는 에러 발생

 

2. 문제원인

모든 브라우저 중 IE만 이러한 문제가 발생한다.

IE에서 다른창과의 생성된 노드는 공유되지 않기 때문이다. 

그러므로 동적으로 노드를 생성하고 추가하려면 해당 객체창에서 실행해야한다.  

 

3. 문제해결

만약, 팝업창에서 동적으로 appendChild를 할 경우에 팝업창에서 createElement를 해서 붙이면 안되고 

부모창 객체로 createElement를 해서 append 해야한다.

/*
* 전제
* 팝업창에서 동적으로 노드요소를 생성할 때, 부모창에 붙여야하는 경우
* 팝업창 객체에서 생성해서 붙이는게 아니라 부모창 객체에 생성하여 붙여야한다.
*/

// 부모객체
var parent = window.opener.document.get~

// 팝업객체(자식객체)
var popup = document.get~

// 부모객체에 노드 추가 
var add1 = parent.createElement("추가노드");
// 가능
parent.appendChild(add1);

// 팝업객체에 노드 추가해서 붙여도 안됨
var add2 = popup.createElement("추가노드");
// 불가능
parent.appendChild(add2);

위와 같이 소스를 수정하거나 감안하여 수정하면 모든 브라우져에서도 해당 노드 생성, 추가가 적용이 된다.