aboutsummaryrefslogtreecommitdiff
path: root/files/zh-tw/web/api/history/index.html
blob: b4a1d7603e8731df65c2d9b6fbae6ca8cadb3bb8 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
---
title: History
slug: Web/API/History
translation_of: Web/API/History
---
<div>{{ APIRef("HTML DOM") }}</div>

<p><strong><code>History</code></strong> 介面允許操控瀏覽器的 <em>session history</em> 紀錄,為當前面頁所在分頁中訪問、或於當前面頁中透過頁面框架(frame)所載入的頁面。</p>

<h2 id="屬性">屬性</h2>

<p><em>The <code>History</code></em><em> interface doesn't inherit any property.</em></p>

<dl>
 <dt>{{domxref("History.length")}} {{readOnlyInline}}</dt>
 <dd>Returns an <code>Integer</code> representing the number of elements in the session history, including the currently loaded page. For example, for a page loaded in a new tab this property returns <code>1</code>.</dd>
 <dt>{{domxref("History.current")}} {{readOnlyInline}} {{ non-standard_inline() }} {{ obsolete_inline(26) }}</dt>
 <dd>Returns a {{domxref("DOMString")}} representing the URL of the active item of the session history. This property was never available to web content and is no more supported by any browser. Use {{domxref("Location.href")}} instead.</dd>
 <dt>{{domxref("History.next")}} {{readOnlyInline}} {{ non-standard_inline() }} {{ obsolete_inline(26) }}</dt>
 <dd>Returns a {{domxref("DOMString")}} representing the URL of the next item in the session history. This property was never available to web content and is not supported by other browsers.</dd>
 <dt>{{domxref("History.previous")}} {{readOnlyInline}} {{ non-standard_inline() }} {{ obsolete_inline(26) }}</dt>
 <dd>Returns a {{domxref("DOMString")}} representing the URL of the previous item in the session history. This property was never available to web content and is not supported by other browsers.</dd>
 <dt>{{domxref("History.scrollRestoration")}} {{experimental_inline}}</dt>
 <dd>Allows web applications to explicitly set default scroll restoration behavior on history navigation. This property can be either <code>auto</code> or <code>manual</code>.</dd>
 <dt>{{domxref("History.state")}} {{readOnlyInline}} {{ gecko_minversion_inline("2.0") }}</dt>
 <dd>Returns an <code>any</code> value representing the state at the top of the history stack. This is a way to look at the state without having to wait for a {{event("popstate")}} event.</dd>
</dl>

<h2 id="方法">方法</h2>

<p><em>The <code>History</code></em> <em>interface doesn't inherit any methods.</em></p>

<dl>
 <dt>{{domxref("History.back()")}}</dt>
 <dd>回到 session history 紀錄中的前一頁,等同於使用者按下瀏覽器的上一頁按鈕。相當於 <code>history.go(-1)</code><div class="note">Calling this method to go back beyond the first page in the session history has no effect and doesn't raise an exception.</div>
 </dd>
 <dt>{{domxref("History.forward()")}}</dt>
 <dd>回到 session history 紀錄中的下一頁,等同於使用者按下瀏覽器的下一頁按鈕。相當於 <code>history.go(1)</code><div class="note">Calling this method to go forward beyond the most recent page in the session history has no effect and doesn't raise an exception.</div>
 </dd>
 <dt>{{domxref("History.go()")}}</dt>
 <dd>自 session history 紀錄中載入一個頁面,利用該頁面相對於目前頁面的所在位置,例如 -1 為前一頁或 1 為下一頁。若指定了一個超出範圍的值(舉例來說,在 session history 沒有先前訪頁面的情況下指定 -1),此方法將會是靜默(不會產生錯誤)且沒有任何效果的。不帶參數或是傳入 0 呼叫 <code>go()</code> 會重新載入目前頁面。Internet Explorer <a href="http://msdn.microsoft.com/en-us/library/ms536443(VS.85).aspx">也可以傳入字串</a>來前往一個於瀏覽歷史列表中指定的頁面。</dd>
 <dt>{{domxref("History.pushState()")}} {{ gecko_minversion_inline("2.0") }}</dt>
 <dd>插入給定的資料與指定的標題(title)以及選擇性的 URL 至 session history 堆疊(stack)中。給定的資料將被 DOM 視為不透明的(opaque);可以指定任何可被序列化的 JavaScript 物件。請注意 Firefox 目前會忽略標題(title)參數;更多資訊請參閱<a href="/zh-TW/docs/Web/API/History_API">操控瀏覽器歷史紀錄</a></dd>
 <dt>{{domxref("History.replaceState()")}} {{ gecko_minversion_inline("2.0") }}</dt>
 <dd>以指定的資料、標題(title)及可選的 URL 來更新歷史紀錄堆疊(history stack)中近期的項目。給定的資料將被 DOM 視為不透明的(opaque);可以指定任何可被序列化的 JavaScript 物件。請注意 Firefox 目前會忽略標題(title)參數;更多資訊請參閱<a href="/zh-TW/docs/Web/API/History_API">操控瀏覽器歷史紀錄</a></dd>
</dl>

<h2 id="規範">規範</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('HTML WHATWG', "browsers.html#the-history-interface", "History")}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>Adds the <code>scrollRestoration</code> attribute.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', "browsers.html#the-history-interface", "History")}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>Initial definition.</td>
  </tr>
  <tr>
   <td>{{SpecName('Custom Scroll Restoration', '#web-idl', "History")}}</td>
   <td>{{Spec2('Custom Scroll Restoration')}}</td>
   <td>Adds the <code>scrollRestoration</code> attribute.</td>
  </tr>
 </tbody>
</table>

<h2 id="瀏覽器相容性">瀏覽器相容性</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>pushState</code> and <code>replaceState</code></td>
   <td>{{CompatChrome(5.0)}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>4.0 <sup>[1]</sup></td>
   <td>10</td>
   <td>11.5</td>
   <td>5</td>
  </tr>
  <tr>
   <td><code>scrollRestoration</code></td>
   <td>{{CompatChrome(46.0)}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoDesktop("46.0")}}</td>
   <td>{{CompatNo}}</td>
   <td>33</td>
   <td>{{CompatVersionUnknown}}<sup>[2]</sup></td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Android Webview</th>
   <th>Edge</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
   <th>Chrome for Android</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>pushState</code> and <code>replaceState</code></td>
   <td>2.2</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>10</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>4.3</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>scrollRestoration</code></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatChrome(46.0)}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}<sup>[2]</sup></td>
   <td>{{CompatChrome(46.0)}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] In Firefox 2 through 5, the passed object is serialized using JSON. Starting in Firefox 6, the object is serialized using <a href="/en/DOM/The_structured_clone_algorithm" title="en/DOM/The structured clone algorithm">the structured clone algorithm</a>. This allows a wider variety of objects to be safely passed.</p>

<p>[2] WebKit <a href="https://trac.webkit.org/changeset/213590/webkit">bug 147782</a></p>

<h2 id="參見">參見</h2>

<ul>
 <li>The {{domxref("Window.history")}} property returning the history of the current session.</li>
</ul>