DOM
Window
对象提供对浏览器会话历史的访问 (不要混淆
WebExtensions 历史
) 透过
history
object. It exposes useful methods and properties that let you navigate back and forth through the user's history, and manipulate the contents of the history stack.
Moving backward and forward through the user's history is done using the
back()
,
forward()
,和
go()
方法。
要透过历史后退:
window.history.back()
This acts exactly as if the user clicked on the Back button in their browser toolbar.
Similarly, you can move forward (as if the user clicked the Forward button), like this:
window.history.forward()
可以使用
go()
method to load a specific page from session history, identified by its relative position to the current page. (The current page's relative position is
0
)。
To move back one page (the equivalent of calling
back()
):
window.history.go(-1)
要前进页面,就像调用
forward()
:
window.history.go(1)
Similarly, you can move forward 2 pages by passing
2
, and so forth.
Another use for the
go()
method is to refresh the current page by either passing
0
, or by invoking it without an argument:
// The following statements // both have the effect of // refreshing the page window.history.go(0) window.history.go()
You can determine the number of pages in the history stack by looking at the value of the
length
特性:
let numberOfEntries = window.history.length
历史
The following example assigns a listener to the
onpopstate
property. And then illustrates some of the methods of the history object to add, replace, and move within the browser history for the current tab.
window.onpopstate = function(event) {
alert(`location: ${document.location}, state: ${JSON.stringify(event.state)}`)
}
history.pushState({page: 1}, "title 1", "?page=1")
history.pushState({page: 2}, "title 2", "?page=2")
history.replaceState({page: 3}, "title 3", "?page=3")
history.back() // alerts "location: http://example.com/example.html?page=1, state: {"page":1}"
history.back() // alerts "location: http://example.com/example.html, state: null"
history.go(2) // alerts "location: http://example.com/example.html?page=3, state: {"page":3}"
| 规范 | 状态 | 注释 |
|---|---|---|
|
HTML 实时标准
The definition of 'History' in that specification. |
实时标准 | 无变化自 HTML5 . |
|
HTML5
The definition of 'History' in that specification. |
推荐 | 初始定义。 |
| 桌面 | 移动 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
历史
|
Chrome 1 | Edge 12 | Firefox 1 | IE 10 | Opera 3 | Safari 1 | WebView Android 1 | Chrome Android 18 | Firefox Android 4 | Opera Android 10.1 | Safari iOS 1 | Samsung Internet Android 1.0 |
back
|
Chrome Yes | Edge 12 | Firefox Yes | IE 10 | Opera Yes | Safari Yes | WebView Android Yes | Chrome Android Yes | Firefox Android Yes | Opera Android Yes | Safari iOS Yes | Samsung Internet Android Yes |
forward
|
Chrome Yes | Edge 12 | Firefox Yes | IE 10 | Opera Yes | Safari Yes | WebView Android Yes | Chrome Android Yes | Firefox Android Yes | Opera Android Yes | Safari iOS Yes | Samsung Internet Android Yes |
go
|
Chrome Yes | Edge 12 | Firefox Yes | IE 10 | Opera Yes | Safari Yes | WebView Android Yes | Chrome Android Yes | Firefox Android Yes | Opera Android Yes | Safari iOS Yes | Samsung Internet Android Yes |
length
|
Chrome Yes | Edge 12 | Firefox Yes | IE 10 | Opera Yes | Safari Yes | WebView Android Yes | Chrome Android Yes | Firefox Android Yes | Opera Android Yes | Safari iOS Yes | Samsung Internet Android Yes |
pushState
|
Chrome 5 | Edge 12 |
Firefox
4
|
IE 10 | Opera 11.5 | Safari 5 | WebView Android ≤37 | Chrome Android 18 |
Firefox Android
4
|
Opera Android 11.5 | Safari iOS 4.3 | Samsung Internet Android 1.0 |
replaceState
|
Chrome 5 | Edge 12 |
Firefox
4
|
IE 10 | Opera 11.5 | Safari 5 | WebView Android ≤37 | Chrome Android 18 |
Firefox Android
4
|
Opera Android 11.5 | Safari iOS 4.3 | Samsung Internet Android 1.0 |
scrollRestoration
|
Chrome 46 | Edge 79 | Firefox 46 | IE No | Opera 33 | Safari Yes | WebView Android No | Chrome Android 46 | Firefox Android Yes | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 5.0 |
state
|
Chrome Yes | Edge 12 | Firefox Yes | IE 10 | Opera Yes | Safari Yes | WebView Android Yes | Chrome Android Yes | Firefox Android Yes | Opera Android Yes | Safari iOS Yes | Samsung Internet Android Yes |
完整支持
不支持
见实现注意事项。