자바스크립트, DOM (도큐먼트 오브젝트 모델)의 트리구조

오늘 이거 때문에 3시간을 끙끙거린 바로는,
IE에서 길들여진 못된 습관은 FF에서 적용되지 않는다는 것이였다.

우선, 부모.asp에서 자식.asp로 팝업을 띄운다.
자식에서 선택된 값이 부모페이지에서 input의 value에 박혀야 한다는 것인데..

우선 IE에서 잘돌아가는 소스

function putApproverPath(APApprovePath, APNumber){

top.opener.docForm.APApprovePath.value = APApprovePath;
top.opener.docForm.APNumber.value = APNumber;
top.close();
}

근데, FF에서는 전혀 먹히지 않는다. 요녀석이 요동도 하지 않는다.
getElementById('APApprovePath')를 쓰기도 하고,
form에 객체니까, name을 주로 쓰니까..name으로? getElementByname로도 바꿔보고,
opener.document.docForm.getElementById('APApprovePath').value도 해봤지만,
먹지않는다...

도대체 어떻게 된것인지 모르겠다..뭐가 잘못된 것일까..

그리고는 생각했다. 우선 APApprovePath나, APNumber를 alert(APApprovePath);로 뿌려봤더니 나온다.
그러면, 결국 문서를 지정하는 opener나 document에서 부모창을 찾지 못한다는 것이였다.

opener.document.docForm.getElementById('APApprovePath').에서 top.을 추가했다.
프레임이 있는 팝업을 연동하는 것이니, [ 솔직히 거슬리지만..다른팀에서 그렇게 만들어놨다.]
top.이 있어야 되고, 팝업을 연 opener.그리고 문서를 안의 input임으로, document.getElementById().

그럼. 결국

function putApproverPath(APApprovePath, APNumber){

top.opener.document.getElementById('APApprovePath').value = APApprovePath;
top.opener.document.getElementById('APNumber').value = APNumber;
top.close();
}

으하하하!!!! 돌아가는 것이다!!! IE에서도, FF에서도 돌아가는 것이다!!!
ぐ(>▽< )ぐ 기분좋아 죽을것 같다!!!

그러나, 한편으로 드는 생각.
나는 아직도 문서의 구조를 깨닫지 못했구나 싶어서, 이리저리 찾아봤더니,
모질라 게시판에 좋은 글이 있었다. :)
좀 더 공부를 해야겠다 싶다.

getElementById 객체는 document 객체의 메소드
document 객체는 window의 하위객체
forms 객체는 window의 하위객체 입니다. document와 동급의 위치 - 박민권님

+ 태그 : 프로그래밍 , 웹표준 , 자바스크립트 , DOM트리구조 , getElementById