本站電子書

您可以在這些電子書店找到本站電子書: Google Play 圖書iBooks StoreHyReadReadmooPubu
===>>>本站推出學習遊戲意見調查<<<===《如何自學程式設計》入選 Google Play 台灣地區2016年度最佳書籍

HTML DOM 快速導覽 - history 物件的方法 back()

history.back() 使瀏覽器 (broswer) 回到上一頁,也就是上一次拜訪過的網頁。



舉例如下
function wback() {
    window.history.back();
    slength();
}

function wnext() {
    window.history.forward();
    slength();
}

function wgo() {
    window.history.go(-2);
    slength();
}

function t51() {
    window.location.assign("window005_1.html");
    slength();
}

function t52() {
    window.location.assign("window005_2.html");
    slength();
}

function slength() {
    var s = document.getElementById("show");
    s.innerHTML = window.history.length;
}

/* 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:window005.js
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 */


這裡我們用 wback() 函數呼叫 back()
function wback() {
    window.history.back();
    slength();
}


我們利用三個 HTML 文件載入 window005.js ,以下為 window005.html
<!DOCTYPE html>
<html>
<head>
<title>HTML DOM DEMO</title>
<script src="window005.js" type="text/javascript"></script>
</head>
<body>
<input type="button" value="BACK" onclick="wback();">
<input type="button" value="NEXT" onclick="wnext();">
<input type="button" value="GO-2" onclick="wgo();">
<input type="button" value="5_1" onclick="t51();">
<div>window005.html</div>
<div>length: <span id="show"></span></div>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:window005.html
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 -->


以下為 window005_1.html
<!DOCTYPE html>
<html>
<head>
<title>HTML DOM DEMO</title>
<script src="window005.js" type="text/javascript"></script>
</head>
<body>
<input type="button" value="BACK" onclick="wback();">
<input type="button" value="NEXT" onclick="wnext();">
<input type="button" value="GO-2" onclick="wgo();">
<input type="button" value="5_2" onclick="t52();">
<div>window005_1.html</div>
<div>length: <span id="show"></span></div>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:window005_1.html
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 -->


以下為 window005_2.html
<!DOCTYPE html>
<html>
<head>
<title>HTML DOM DEMO</title>
<script src="window005.js" type="text/javascript"></script>
</head>
<body>
<input type="button" value="BACK" onclick="wback();">
<input type="button" value="NEXT" onclick="wnext();">
<input type="button" value="GO-2" onclick="wgo();">
<div>window005_2.html</div>
<div>length: <span id="show"></span></div>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:window005_2.html
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 -->


首先開啟 window005.html ,然後利用 5_15__2 走到 window005_2.html ,我們按下 BACK ,網頁就會回到 window005_1.html



中英文術語對照
瀏覽器broswer
屬性attribute
方法method


您可以繼續參考
window 物件


相關目錄
HTML DOM 快速導覽
JavaScript 教材
首頁


參考資料
https://developer.mozilla.org/en/DOM/window.history
http://msdn.microsoft.com/en-us/library/ms535864(VS.85).aspx
http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#the-history-interface

沒有留言: