ホームページ > 記事 > ウェブフロントエンド > JavaScriptを使用したページ更新のいくつかの方法
以下では、frame.html、top.html、bottom.html という名前の 3 つのページを例として、その方法を説明します。
frame.html は、上部 (top.html) と下部 (bottom.html) の 2 つのページで構成されます。 コードは次のとおりです。
コードをコピーします。 コードは次のとおりです。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> frame </TITLE> </HEAD> <frameset rows="50%,50%"> <frame name=top src="top.html"> <frame name=bottom src="bottom.html"> </frameset> </HTML>
ここで、top.html (つまり、上のページ) に、bottom.html (つまり、下のページ) を更新するための 7 つのボタンがあると仮定します。次の 7 つのステートメントを使用するかどうかはあなた次第です。使いやすくなります。 top.html ページのコードは次のとおりです:
コードをコピーします コードは次のとおりです:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> top.html </TITLE> </HEAD> <BODY> <input type=button value="刷新1" onclick="window.parent.frames[1].location.reload()"><br> <input type=button value="刷新2" onclick="window.parent.frames.bottom.location.reload()"><br> <input type=button value="刷新3" onclick="window.parent.frames['bottom'].location.reload()"><br> <input type=button value="刷新4" onclick="window.parent.frames.item(1).location.reload()"><br> <input type=button value="刷新5" onclick="window.parent.frames.item('bottom').location.reload()"><br> <input type=button value="刷新6" onclick="window.parent.bottom.location.reload()"><br> <input type=button value="刷新7" onclick="window.parent['bottom'].location.reload()"><br> </BODY> </HTML>
以下は、bottom.html ページのソース コードです。 、以下のページが実際に更新されたことを証明するために、ページが読み込まれた後にダイアログ ボックスが表示されます。
コードをコピーします コードは次のとおりです:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> bottom.html </TITLE> </HEAD> <BODY onload="alert('我被加载了!')"> <h1>This is the content in bottom.html.</h1> </BODY> </HTML>
説明:
コードをコピーします コードは次のとおりです:
1 .window は現在のページを指します。たとえば、この例では、top.html ページを指します。 2.parent は、現在のページの親ページ、つまりそれを含むフレーム ページを指します。たとえば、この例では、framedemo.html を参照します。
3.frames はウィンドウオブジェクトであり配列です。フレーム内のすべてのサブページを表します。
4.itemがメソッドです。配列内の要素を返します。
5. サブページが内部に他のサブページを含むフレーム ページである場合、上記の方法の一部は機能しない可能性があります。
添付ファイル:
Javascript を使用してページを更新するいくつかの方法:
1 history.go(0) 2 location.reload() 3 location=location 4 location.assign(location) 5 document.execCommand('Refresh') 6 window.navigate(location) 7 location.replace(location) 8 document.URL=location.href
2. ページを自動的に更新します 1. ページを自動的に更新します: 次のコードを 93f0f5c25f18dab9d176bd4f6de5d30e 領域に追加します
bfa4f305396a818ebcdcb365a9a75c4e
20 は、20 秒ごとにページを更新することを意味します。
0e463a52e30ac011112998d18adefa80 20 秒後に 20 本の指が http://www.jb51.net ページにジャンプします。 JSのバージョンを自動更新します
<script language="JavaScript">
function myrefresh()
{
window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>
3. JavaでServlerやActionなどのプログラムを書いているとき、操作完了後に元のページに戻りたい場合(ウィンドウを開いている場合など)、現在のページを閉じてください。ページを更新し、親ページを更新します)
コードをコピーします コードは次のとおりです:1 PrintWriter out = response.getWriter();
2 out.write("<script type=\"text/javascript\">");
3 ////子窗口刷新父窗口
4 out.write("self.opener.location.reload();");
5 //关闭窗口
6 out.write("window.opener=null;");
7 out.write("window.close();");
8 out.write("</script>");
IV. フレームを更新するための JS スクリプト ステートメント
コードは次のとおりです 复制代码 代码如下: 复制代码 代码如下: 复制代码 代码如下:<script language=JavaScript>
self.opener.location.reload();
</script>
3.如何刷新另一个框架的页面用 (上面的实例以说明了)语句1. window.parent.frames[1].location.reload();
语句2. window.parent.frames.bottom.location.reload();
语句3. window.parent.frames["bottom"].location.reload();
语句4. window.parent.frames.item(1).location.reload();
语句5. window.parent.frames.item('bottom').location.reload();
语句6. window.parent.bottom.location.reload();
语句7. window.parent['bottom'].location.reload();
4.如果想关闭窗口时刷新或者想开窗时刷新的话,在6c04bd5ca3fcae76e30b72ad730ca86d中调用以下语句即可。<body onload="opener.location.reload()">
开窗时刷新
<body onUnload="opener.location.reload()">
关闭时刷新
<script language="javascript"> window.opener.document.location.reload()
</script>
JavaScript 实现页面跳转的几种方法:
window.location.href="new.jsp?msg='hello";
self.location='new.jsp?pam='omg';
window.navigate("new.jsp") ;
top.location="show.jsp";
以上がJavaScriptを使用したページ更新のいくつかの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。