때로는 한 컨테이너의 링크를 클릭한 다음 다른 컨테이너에 콘텐츠를 표시하는 작업이 있습니다. HTML에서 iframe은 페이지의 지정된 영역에 콘텐츠를 쉽게 표시하는 데 사용됩니다. 이 문서에서는 두 가지 다른 예를 사용하여 링크를 사용하여 다른 iframe 링크를 통해 iframe을 로드합니다. 예제 1에서는 위쪽 iframe의 링크를 사용하여 아래쪽 iframe에 서로 다른 두 이미지를 표시합니다. 예제 2에서는 상위 iframe의 링크를 사용하여 비디오 콘텐츠가 하위 iframe과 상위 iframe 모두에 표시됩니다.
폴더 및 페이지 디자인 단계 -
1단계 - iFrameFile1.html과 iFrameFile2.html 두 개의 파일을 만듭니다.
2단계 - iFrameFile1.html에 HTML 코드를 작성하고 이 파일에 iframeUpper 및 iframeBottom이라는 두 개의 iFrame을 만듭니다.
3단계 - iframeBottom을 비워 두고 iframeUpper 내부에서 iFrameFile2.html 파일을 로드합니다.
4단계 - iFrameFile2.html에 HTML 코드를 작성하고 이 파일에 두 개의 태그를 만듭니다.
5단계 - 이미지 파일의 파일 이름에 대한 href 및 상대 또는 절대 경로를 사용하고 태그에 target="iframeBottom"을 사용합니다.
6단계 - 브라우저에서 iFrameFile1.html을 엽니다. 링크는 위의 iframe에 표시됩니다. 링크를 하나씩 클릭하면 하단 iframe의 이미지 파일 내용이 변경되는 것을 확인할 수 있습니다.
이 예제에서는 다음 파일이 사용되었습니다File1 − iFrameFile1.html
파일 2 - iFrameFile2.html
파일 3 −birdalone.jpg
파일 4 −bird.jpg
Code For iFrameFile1.html예 2: 상위 Iframe의 텍스트 링크를 사용하여 하위 Iframe 및 상위 Iframe에 비디오 콘텐츠 표시
폴더 및 페이지 디자인 단계 -
1단계 - iFrameFile11.html과 iFrameFile22.html 두 개의 파일을 만듭니다.
2단계 - iFrameFile11.html에 HTML 코드를 작성하고 이 파일에 iframeUpper 및 iframeBottom이라는 두 개의 iFrame을 만듭니다.
3단계 - iframeBottom을 비워 두고 iframeUpper 내에서 iFrameFile22.html 파일을 로드합니다.
4단계 - iFrameFile22.html에 html 코드를 작성하고 이 파일에 두 개의 태그 를 만듭니다.
5단계 - 태그에서 동영상 파일의 상대 또는 절대 경로 및 파일 이름과 함께 href를 사용하고 하나의 태그에서는 target="iframeBottom"을 사용하고 다른 태그에서는 target=_self를 사용합니다.
6단계 - 브라우저에서 iFrameFile11.html을 엽니다. 링크는 위의 iFrame에 표시됩니다. 링크를 클릭하면 비디오 파일의 내용을 볼 수 있습니다. 먼저 콘텐츠가 하단 iFrame에 표시되고 그 다음에는 동일한 상단 iFrame에 표시됩니다.
이 예제에서는 다음 파일이 사용되었습니다
파일 1 − iFrameFile11.html
파일 2 - iFrameFile22.html
파일 3 - Birdvideo.mp4
iFrameFile11.html 코드:이 HTML Iframe 및 a-href 기사에서는 두 가지 다른 예를 사용하여 첫 번째 Iframe의 링크를 클릭하여 두 번째 Iframe에 콘텐츠를 표시하는 방법을 제공합니다. 두 번째 예에서는 동일한 Iframe 내에서 콘텐츠를 보는 방법도 보여줍니다. 첫 번째 예에서는 이미지 파일을 사용하고, 두 번째 예에서는 비디오 표시 예를 사용합니다.
위 내용은 한 iframe에서 다른 iframe으로 하이퍼링크를 로드하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!