JavaScript 視窗歷史記錄

在本教程中,你將瞭解 JavaScript 視窗歷史記錄物件。

歷史物件

Window 物件的 history 屬性指的是歷史物件。它包含瀏覽器會話歷史記錄,當前框架或視窗中訪問的所有頁面的列表。

由於 Window 是一個全域性物件,並且它位於作用域鏈的頂部,因此 Window 物件的屬性即 window.history 可以在沒有 window. 字首的情況下訪問,例如 window.history.length 可以寫為 history.length

以下部分將向你展示如何獲取使用者瀏覽歷史記錄的資訊。但是,出於安全原因,不允許指令碼訪問儲存的 URL。

獲取訪問的頁數

window.history.length 屬性可用於獲取當前視窗的瀏覽器會話歷史記錄中的頁數。它還包括當前載入的頁面。

你可以使用此屬性檢視使用者在當前瀏覽器會話期間訪問了多少頁面,如以下示例所示:

<script>
function getViews() {
    alert("You've accessed " + history.length + " web pages in this session.");
}
</script>
 
<button type="button" onclick="getViews();">Get Views Count</button>

回到上一頁

你可以使用 History 物件的 back() 方法,即 history.back() 返回會話歷史記錄中的上一頁。它與單擊瀏覽器的後退按鈕相同。

<script>
function goBack() {
    window.history.back();
}
</script>
 
<button type="button" onclick="goBack();">Go Back</button>

如果你的瀏覽器後退按鈕處於活動狀態,則單擊此 “返回” 連結會使你退後一步。

前進到下一頁

你可以使用 History 物件的 forward() 方法,即 history.forward() 前進到會話歷史記錄中的下一頁。它與單擊瀏覽器的前進按鈕相同。

<script>
function goForward() {
    window.history.forward();
}
</script>
 
<button type="button" onclick="goForward();">Go Forward</button>

如果你的瀏覽器轉發按鈕處於活動狀態,則單擊此 “前進” 連結會向前邁進一步。

去一個特定的頁面

你還可以使用 History 物件的 go() 方法從會話歷史記錄載入特定頁面,也就是 history.go() 。此方法採用整數作為引數。負整數在歷史記錄中向後移動,正整數在歷史記錄中向前移動。

window.history.go(2);  // Go back two pages
window.history.go(-1); // Go back one page
window.history.go(0);  // Reload the current page
window.history.go(1);  // Go forward one page
window.history.go(2);  // Go forward two pages

提示: 如果你嘗試訪問並不在視窗的歷史存在,那麼 back()forward()go() 會什麼也不做。