首頁 > 開發者 > JavaScript

Javascript重新整理網頁方法大全

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！
  1. 先來看一個簡單的例子：
  2. 下面以三個頁面分別命名為frame.html、top.html、bottom.html為例來具體說明如何做。 
  4. frame.html 由上(top.html)下(bottom.html)兩個頁面組成，代碼如下：
  5. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  6. <HTML>
  7. <HEAD>
  8. <TITLE> frame </TITLE>
  9. </HEAD> 
  10. <frameset rows="50%,50%">
  11. <frame name=top  src="top.html">
  12. <frame name=bottom  src="bottom.html">
  13. </frameset>
  14. </HTML>
  16. 現在假設top.html (即上面的頁面) 有七個button來實現對bottom.html (即下面的頁面) 的重新整理，可以用以下七種語句，哪個好用自己看著辦了。
  18. 語句1. window.parent.frames[1].location.reload();
  19. 語句2. window.parent.frames.bottom.location.reload();
  20. 語句3. window.parent.frames["bottom"].location.reload();
  21. 語句4. window.parent.frames.item(1).location.reload();
  22. 語句5. window.parent.frames.item('bottom').location.reload();
  23. 語句6. window.parent.bottom.location.reload();
  24. 語句7. window.parent['bottom'].location.reload();
  26. top.html 頁面的代碼如下：
  28. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  29. <HTML>
  30.  <HEAD>
  31.   <TITLE> top.html </TITLE>
  32.  </HEAD>
  33. <BODY>
  34. <input type=button value="重新整理1" onclick="window.parent.frames[1].location.reload()"><br>
  35. <input type=button value="重新整理2" onclick="window.parent.frames.bottom.location.reload()"><br>
  36. <input type=button value="重新整理3" onclick="window.parent.frames['bottom'].location.reload()"><br>
  37. <input type=button value="重新整理4" onclick="window.parent.frames.item(1).location.reload()"><br>
  38. <input type=button value="重新整理5" onclick="window.parent.frames.item('bottom').location.reload()"><br>
  39. <input type=button value="重新整理6" onclick="window.parent.bottom.location.reload()"><br>
  41. <input type=button value="重新整理7" onclick="window.parent['bottom'].location.reload()"><br>
  42. </BODY>
  43. </HTML>
  44. 下面是bottom.html頁面原始碼，為了證明下方頁面的確被重新整理了，在裝載完頁面彈出一個對話方塊。
  46. bottom.html 頁面的代碼如下：
  47. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  48. <HTML>
  49.  <HEAD>
  50.   <TITLE> bottom.html </TITLE>
  51.  </HEAD>
  52. <BODY onload="alert('我被載入了！')">
  53. <h1>This is the content in bottom.html.</h1>
  54. </BODY>
  55. </HTML>
  58. 解釋一下：
  59. 1.window指代的是當前頁面，例如對於此例它指的是top.html頁面。
  60. 2.parent指的是當前頁面的父頁面，也就是包含它的架構頁面。例如對於此例它指的是framedemo.html。
  61. 3.frames是window對象，是一個數組。代表著該架構內所有子頁面。
  62. 4.item是方法。返回數組裡面的元素。
  63. 5.如果子頁面也是個架構頁面，裡面還是其它的子頁面，那麼上面的有些方法可能不行。
  65. 附：
  66. Javascript重新整理頁面的幾種方法：
  67. 1    history.go(0) 
  68. 2    location.reload() 
  69. 3    location=location 
  70. 4    location.assign(location) 
  71. 5    document.execCommand('Refresh') 
  72. 6    window.navigate(location) 
  73. 7    location.replace(location) 
  74. 8    document.URL=location.href 
  77. 自動重新整理頁面的方法:
  78. 1.頁面自動重新整理：把如下代碼加入<head>地區中
  79. <meta http-equiv="refresh" content="20">
  80. 其中20指每隔20秒重新整理一次頁面.
  82. 2.頁面自動跳轉：把如下代碼加入<head>地區中
  83. <meta http-equiv="refresh" content="20;url=http://www.wyxg.com">
  84. 其中20指隔20秒後跳轉到http://www.hackhome.com頁面
  86. 3.頁面自動重新整理js版
  87. <script language="JavaScript">
  88. function myrefresh()
  89. {
  90.        window.location.reload();
  91. }
  92. setTimeout('myrefresh()',1000); //指定1秒重新整理一次
  93. </script>
  95. ASP.NET如何輸出重新整理父視窗指令碼語句
  96. 1.   this.response.write("<script>opener.location.reload();</script>");  
  98. 2.   this.response.write("<script>opener.window.location.href = opener.window.location.href;</script>");   
  100. 3.   Response.Write("<script language=javascript>opener.window.navigate(''你要重新整理的頁.asp'');</script>")
  102. JS重新整理架構的指令碼語句
  104. //如何重新整理包含該架構的頁面用   
  105. <script language=JavaScript>
  106.    parent.location.reload();
  107. </script>   
  110. //子視窗重新整理父視窗
  111. <script language=JavaScript>
  112.     self.opener.location.reload();
  113. </script>
  114. (　或　<a href="javascript:opener.location.reload()">重新整理</a>   )
  116. //如何重新整理另一個架構的頁面用   
  117. <script language=JavaScript>
  118.    parent.另一FrameID.location.reload();
  119. </script>
  121. 如果想關閉視窗時重新整理或者想開窗時重新整理的話，在<body>中調用以下語句即可。
  123. <body onload="opener.location.reload()"> 開窗時重新整理
  124. <body onUnload="opener.location.reload()"> 關閉時重新整理
  126. <script language="javascript">
  127. window.opener.document.location.reload()
  128. </script>

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

相關關鍵詞：
formatmoney javascript javascript getdatetime unlink javascript hmac javascript javascript session javascript addslashes javascript bindto
相關文章
漂亮簡單Javascript 調色盤代碼
javascript的indexOf忽略大小寫方法_javascript技巧
JavaScript的parseInt 取整使用
用js一招破解所有網頁的加密原始碼的方法
jQuery AJAX timeout 逾時問題詳解，jqueryajax

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

熱門內容

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More