iframe 부모, 자식 함수 실핼

<body>

</body>

// iframe 접근

window.frames.length;

// window.frames[0].document;

// iframe의 window의 document객체

document.getElementById(‘iframeA’);

// iframe 엘리먼트document.getElementById(‘iframeA’).contentWindow.document;

// iframe의 window의 document객체

// iframe객체의 window$(‘iframe’).get(0).contentWindow // window

// iframe객체의 document$(‘iframe’).get(0).contentDocument // document// 또는 $(‘iframe’).get(0).contentWindow.document

// document

// 부모html에서 자식iframe 함수 실행

$(‘#iframe’).get(0).contentWindow.함수명(args);

$(‘#iframe’)[0].contentWindow.함수명(args);

// 부모html에서 자식iframe 변수접근

$(‘#iframe’).get(0).contentWindow.접근할변수명;

IE8 하위버전 호환을 위해 contentWindow 를 확인해줄필요가..있습니다

<pre>var objDoc = obj.contentWindow || obj.contentDocument;</pre>

// 부모html에서 자식iframe 접근, 제어

// jQuery$(‘#iframe’).contents().find(‘#foo’).text(‘안녕하세요’);

// 자식iframe에서 부모 html 변수, 함수 호출window.parent.변수명; // 한단계 부모 // 그렇다면 두단계 부모는?? window.parent.parent.변수명window.top.변수명; // 최상위 부모 // html(최상위) -> iframe -> iframe – iframe(자식) (여기에서 top을 쓰면 최상위 부모로 접근, parent를 쓰면 바로위 iframe에 접근)

// iframe 이전페이지로$(‘iframe’).get(0).contentWindow.history.go(-1);

// iframe 새로고침$(‘iframe’).get(0).contentDocument.location.reload(); // document

// iframe 로드$(‘iframe’).load(function(){ // iframe이 모두 load된후 제어 $(this).contents().find(‘body’);});

// 자식iframe에서 부모html의 다른 iframe에 접근$(‘제어할 아이디’, parent.frames[“부모창 제어할 frame의 name값”].document).html(“여기도 제어한다.”);

// 자식iframe에서 부모html 접근 (최상위 부모html에 접근된다.)

$(‘부모창 제어할 아이디’, parent.document).contents().find(‘body’).html();

// $(‘부모창 제어할 아이디’, parent.document) -> $(‘#ID이름’,top.document)로 변경해도 된다.

// html -> iframe -> iframe -> iframe 이런 구조일 경우

// 자식iframe 한단계 윗 부모html(iframe)에 접근하기
window.frameElement

// iframe 또는 this.frameElement .parentNode // 부모
<div> <iframe src=”sub.html”></iframe></div> window.frameElement.parentNode

// 자식iframe을 감싸는 부모는 div가 된다.if(!window.frameElement){ console.log(‘최상위 프레임’); }

// 요소(node)가 iframe이 아닐경우에는 최상위(root)부모 html 이다.