상위 페이지의 Iframe에서 JavaScript 함수를 호출하는 방법은 무엇입니까?

상위 페이지에서 Iframe의 JavaScript 함수 호출

iframe이 웹페이지 내에 삽입되면 격리되는 샌드박스 환경이 생성됩니다. 상위 페이지의 코드. 그러나 상위 페이지에서 iframe에 정의된 JavaScript 함수에 액세스하고 호출해야 하는 시나리오가 있을 수 있습니다.

도전 과제 이해

표준 접근 방식인 호출 iframe 내에서 parent.functionName()은 이 경우 작동하지 않습니다. 이는 상위 페이지가 iframe의 바로 상위 페이지가 아니라 iframe의 샌드박스 가상 환경이기 때문입니다.

Iframe의 콘텐츠 창 액세스

액세스 및 호출 iframe 내에서 JavaScript가 작동하려면 해당 contentWindow 속성에 대한 참조를 얻어야 합니다. 이 속성은 iframe의 창 개체를 나타내며 전역 변수, 함수 및 DOM에 대한 액세스를 제공합니다.

JavaScript 함수 호출

contentWindow가 있으면 참조에 따르면 다음 구문을 사용하여 iframe 내에서 JavaScript 함수를 호출할 수 있습니다.

document.getElementById('iframeID').contentWindow.functionName();

여기서 iframeID는 iframe의 id 속성.

window.frames를 사용하여 프레임에 액세스

또는 window.frames를 사용하여 iframe에 액세스할 수도 있습니다. 이 방법을 사용할 때 모든 최신 브라우저에서 지원되지 않을 수도 있다는 점에 유의해야 합니다. 이 접근 방식의 구문은 다음과 같습니다.

window.frames[0].frameElement.contentWindow.functionName();

예

iframe의 ID가 "targetFrame"이고 호출하려는 함수의 이름이 "targetFunction"이라고 가정합니다. ()":

document.getElementById('targetFrame').contentWindow.targetFunction();

위 내용은 상위 페이지의 Iframe에서 JavaScript 함수를 호출하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!