iFrame 내의 요소에 액세스 iFrame 내의 요소에 액세스하는 것은 웹 개발에서 흔히 발생하는 문제일 수 있습니다. iFrame은 외부 콘텐츠를 웹페이지에 로드하는 데 사용되는 내장 프레임이며 내부 요소와 상호 작용하는 방법을 이해하는 것이 중요합니다. 질문: 내에 있는 요소?</p> <p><strong>답변:</strong></p> <p><div> <iframe>의 요소인 경우 다음 접근 방식을 활용할 수 있습니다.</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var iframe = document.getElementById('iframeId'); var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;</pre><div class="contentsignin">로그인 후 복사</div></div> <p>또는 "||"를 사용하여 코드를 단순화할 수 있습니다. 연산자:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var iframe = document.getElementById('iframeId'); var innerDoc = iframe.contentDocument || iframe.contentWindow.document;</pre><div class="contentsignin">로그인 후 복사</div></div> <p>이 코드는 iframe의 contentDocument 및 contentWindow.document 속성을 모두 확인하여 내부 문서(iframe 콘텐츠)를 가져옵니다.</p> <p>내부 문서가 있으면 다음을 수행할 수 있습니다. 기본 페이지의 요소와 마찬가지로 해당 요소와 상호 작용합니다. 예를 들어 <div> innerDoc.getElementById('divId')를 사용하는 요소.</p> <p><strong>중요 사항:</strong></p> <p>iframe이 기본 페이지와 동일한 도메인에 있어야 한다는 점에 유의하는 것이 중요합니다. 크로스 사이트 스크립팅 문제를 방지합니다. 교차 사이트 스크립팅은 한 도메인의 스크립트가 인증 없이 다른 도메인의 정보에 액세스할 때 발생합니다. 이 주제에 대한 자세한 내용은 다음 리소스를 참조하세요.</p> <ul> <li>MDN: <iframe> 스크립팅</li> <li>MDN: 동일 출처 정책: 교차 출처 스크립트 API 액세스</li> </ul>
