> 웹 프론트엔드 > 프런트엔드 Q&A > iframe이 자바스크립트에서 새로 고쳐지지 않습니다.

iframe이 자바스크립트에서 새로 고쳐지지 않습니다.

王林
풀어 주다: 2023-05-26 16:50:08
원래의
2422명이 탐색했습니다.

JavaScript가 널리 적용됨에 따라 웹 페이지에서 iframe(인라인 프레임)을 사용하여 다른 웹 페이지를 로드하는 경우가 많습니다. 경우에 따라 iframe에 새 웹페이지를 로드해야 하지만 페이지가 새로 고쳐지지 않는 경우가 있습니다. 이 글에서는 이 문제의 원인을 살펴보고 몇 가지 해결 방법을 제시해 보겠습니다.

1. iframe의 작동 원리

문제를 공식적으로 논의하기 전에 먼저 iframe의 작동 원리를 이해해야 합니다. iframe은 실제로 웹페이지를 다른 웹페이지에 삽입합니다. 즉, 웹페이지의 하위 페이지입니다. iframe은 일반적으로 다음과 같이 정의됩니다.

<iframe src="url"></iframe>
로그인 후 복사

여기서 src 속성은 삽입할 웹페이지의 URL을 지정합니다. 페이지가 로드되면 브라우저는 지정된 URL을 로드하고 이를 iframe에 배치합니다. JavaScript 코드를 통해 iframe의 크기와 위치를 제어할 수 있으며 iframe에서 다른 작업을 수행할 수도 있습니다.

2. iframe이 새로 고쳐지지 않는 이유

이제 이 기사의 주제로 돌아가겠습니다. iframe에서 새 웹페이지를 로드한 후 페이지가 새로 고쳐지지 않는 이유는 무엇입니까? 그 이유는 iframe에 새 웹페이지를 로드할 때 실제로는 iframe의 URL만 교체하고 웹페이지를 새로 고치지는 않기 때문입니다. 즉, 새 웹페이지에서 일부 변경 사항을 적용하더라도 iframe을 수동으로 새로 고치지 않는 한 이러한 변경 사항은 iframe에 표시되지 않습니다.

3. 솔루션

이제 iframe이 새로 고쳐지지 않는 이유를 이해했으므로 아래에 몇 가지 해결 방법을 소개하겠습니다.

1. JavaScript를 사용하여 iframe을 새로 고칩니다.

JavaScript 코드를 사용하여 iframe을 새로 고칠 수 있습니다. 코드는 다음과 같습니다.

document.getElementById("myFrame").contentWindow.location.reload();
로그인 후 복사

myFrame 여기에는 iframe의 ID가 있습니다. 이 코드는 iframe의 URL을 다시 로드하고 페이지를 강제로 새로 고칩니다.

2. 메타 태그를 사용하여 iframe 새로 고침

또 다른 방법은 메타 태그를 사용하여 iframe을 자동으로 새로 고치는 것입니다. 새로 고칠 웹 페이지에 다음 태그를 추가할 수 있습니다:

<meta http-equiv="refresh" content="1">
로그인 후 복사

그 중 content 속성은 웹 페이지의 새로 고침 시간을 초 단위로 지정합니다. 이 예에서는 웹페이지가 1초마다 자동으로 새로 고쳐집니다. 이 방법을 사용하면 iframe에서 웹페이지를 자동으로 새로 고치는 것이 쉽습니다.

3. iframe의 SRC 속성을 사용하세요

iframe의 SRC 속성을 직접 수정하여 페이지를 새로 고칠 수도 있습니다. 코드는 다음과 같습니다.

document.getElementById("myFrame").src = document.getElementById("myFrame").src;
로그인 후 복사

이 코드는 현재 iframe의 SRC 속성을 자신에게 다시 할당하여 전체 iframe을 새로 고칩니다.

4. 요약

이 기사에서는 iframe이 JavaScript에서 새로 고쳐지지 않는 이유를 심층적으로 살펴보고 세 가지 해결 방법을 제공했습니다. 어떤 접근 방식을 취하든 iframe에 새 웹 페이지를 쉽게 로드하고 변경 사항을 즉시 업데이트할 수 있습니다. 이 기사가 이 문제를 해결하는 데 도움이 되기를 바라며, 향후 작업에서 JavaScript와 iframe을 더 잘 활용할 수 있기를 바랍니다.

위 내용은 iframe이 자바스크립트에서 새로 고쳐지지 않습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿