html iframe 내장 페이지 점프를 실현하는 데모

10130 단어
iframe 내장 페이지의 이동 방식을 기록해 주십시오
 
코드:
index.html:
<html>
<head>

<title>   title>

<script>
function changeSrc1()
{
    document.getElementById("iframe1").setAttribute("src","1.html");
}
function changeSrc2()
{
    document.getElementById("iframe1").setAttribute("src","2.html");
}
script>

head>
<body>
<div>
    <button id="btn-sub1" href="1.html" target="iframe1" onclick="changeSrc1()">      button>
    <button id="btn-sub2" href="2.html" target="iframe1" onclick="changeSrc2()">      button>
    <a href="1.html" target="iframe1">      a>
    <a href="2.html" target="iframe1">      a>
div>

<div>
    <iframe name="iframe1" id="iframe1" src="1.html">
    iframe>
div>
body>
html>

1.html:
<html>
    <head>
        <title>   title>
    head>

    <body>
        <div>
            <h1>   h1>
        div>
    body>
html>

2.html:
<html>
    <head>
        <title>   title>
    head>

    <body>
        <div>
            <h1>   h1>
        div>
    body>
html>

세 페이지가 같은 폴더에 있음
 
주: target은 iframe의name을 가리키며 id가 아닙니다
 
demo:https://files.cnblogs.com/files/DoubleBarbecue/iframe.rar
 
또한: 이 데모는 간단하지만 기숙사 셋째 형이 본몽에게 새로운 도움을 줘서 고마워요.

좋은 웹페이지 즐겨찾기