HTML: The Living Standard

Edition for Web Developers — Last Updated 24 March 2023

1. 1. 7.2 ナビゲーションおよびセッション履歴に関連するAPI
      1. 7.2.1 Windowオブジェクト
         1. 7.2.1.1 ウィンドウの開閉
         2. 7.2.1.2 Windowオブジェクトのインデックス付きアクセス
         3. 7.2.1.3 Windowオブジェクトの名前付きアクセス
         4. 7.2.1.4 関連ウィンドウへのアクセス
         5. 7.2.1.5 歴史的なブラウザーインターフェイス要素API
      2. 7.2.2 WindowProxy外来オブジェクト
      3. 7.2.3 Locationインターフェイス
      4. 7.2.4 Historyインターフェイス
      5. 7.2.5 イベントインターフェイス
         1. 7.2.5.1 PopStateEventインターフェイス
         2. 7.2.5.2 HashChangeEventインターフェイス
         3. 7.2.5.3 PageTransitionEventインターフェイス
         4. 7.2.5.4 BeforeUnloadEventインターフェイス

7.2 ナビゲーションおよびセッション履歴に関連するAPI

7.2.1 Windowオブジェクト

window.window

window.frames

window.self

これらの属性はすべてwindowを返す。

window.document

windowと関連するDocumentを返す。

document.defaultView

documentに関連付けられたWindowがある場合はそれを返し、そうでなければnullを返す。

7.2.1.1 ウィンドウの開閉

window = window.open([ url [, target [, features ] ] ])

url（デフォルトで"about:blank"）を表示するためのウィンドウを開き、それを返す。target（デフォルトで"_blank"）は、新しいウィンドウの名前を示す。すでにその名前をもつウィンドウが存在する場合、それが再利用される。features引数はコンマ区切りトークンの集合を含むことができる：

"noopener"

"noreferrer"

これらは、ハイパーリンク上のnoopenerおよびnoreferrerリンクタイプと同等に動作する。

"popup"

ユーザーエージェントに、新しいウィンドウに最小限のウェブブラウザーユーザーインターフェイスを提供するように促す。 （すべてのBarPropオブジェクトにもvisibleゲッターに影響を与える。）

globalThis.open("https://email.example/message/CAOOOkFcWW97r8yg=SsWg7GgCmp4suVX9o85y8BvNRqMjuc5PXg", undefined, "noopener,popup");

window.name [ = value ]

ウィンドウの名前を返す。

名前を変更する設定が可能である。

window.close()

ウィンドウを閉じる。

window.closed

ウィンドウが閉じられている場合はtrueを返し、そうでなければfalseを返す。

window.stop()

ドキュメントの読み込みを中止する。

7.2.1.2 Windowオブジェクトのインデックス付きアクセス

window.length

文書ツリーの子ナビゲート可能の数を返す。

window[index]

指定された文書ツリーの子ナビゲート可能に対応するWindowProxyを返す。

7.2.1.3 Windowオブジェクトの名前付きアクセス

window[name]

指示された要素または要素のコレクションを返す。

一般的な規則として、これに依存することはもろいコードを導く。たとえば、新しい機能がウェブプラットフォームに加えられるように、いずれかのIDがこのAPIのマッピングで終わることは時間をかけて変化できる。この代わりに、document.getElementById()またはdocument.querySelector()を使用する。

7.2.1.4 関連ウィンドウへのアクセス

window.top

トップレベルトラバーサルのWindowProxyを返す。

window.opener [ = value ]

オープナーブラウジングコンテキストに対するWindowProxyを返す。

存在しないまたはnullが設定されている場合、nullを返す。

nullに設定可能である。

window.parent

親ナビゲート可能に対するWindowProxyを返す。

window.frameElement

ナビゲート可能コンテナー要素を返す。

存在しない場合、生成元をまたいだ状況でnullを返す。

7.2.1.5 歴史的なブラウザーインターフェイス要素API

歴史的な理由から、Windowインターフェイスには、特定のウェブブラウザーインターフェイス要素の可視性を表すいくつかのプロパティがあった。

プライバシーと相互運用性の理由から、ウィンドウがポップアップウィンドウを表しているかどうかに関係なく、これらのプロパティはすべて同じ値を返すようになった。

window.locationbar.visible

✔MDN

BarProp/visible

Support in all current engines.

Firefox1+Safari3+Chrome1+

---

Opera?Edge79+

---

Edge (Legacy)12+Internet ExplorerNo

---

Firefox Android?Safari iOS1+Chrome Android?WebView Android37+Samsung Internet?Opera Android?

window.menubar.visible

window.personalbar.visible

window.scrollbars.visible

window.statusbar.visible

window.toolbar.visible

Windowがポップアップでない場合はtrueを返す。そうでなければfalseを返す。

7.2.2 WindowProxy外来オブジェクト

WindowProxyは、Windowの通常のオブジェクトをラップする外来オブジェクトであり、ほとんどの操作をラップされたオブジェクトに間接的に転送する。各ブラウジングコンテキストは、関連するWindowProxyオブジェクトを持つ。ブラウジングコンテキストがナビゲートされるとき、ブラウジングコンテキストの関連付けられたWindowProxyオブジェクトによってラップされたWindowオブジェクトが変更される。

7.2.3 Locationインターフェイス

各Windowオブジェクトは、Locationオブジェクトの一意なインスタンスに関連付けられており、Windowオブジェクトの作成時に割り当てられる。

document.location [ = value ]

window.location [ = value ]

現在のページの位置とLocationオブジェクトを返す。

別のページにナビゲートするために、設定可能である。

Locationオブジェクトは、関連付けられたDocumentのURLの表現と、関連付けられたナビゲート可能をナビゲートおよびリロードするためのメソッドを提供する。

location.toString()

location.href

LocationオブジェクトのURLを返す。

与えられたURLにナビゲートするように、設定可能である。

location.origin

Locationオブジェクトの生成元を返す。

location.protocol

Locationオブジェクトのスキームを返す。

変更されたスキームと同じURLにナビゲートするように、設定可能である。

location.host

LocationオブジェクトのURLのホストとポートを返す（スキームのデフォルトポートと異なる場合）。

変更されたホストおよびポートと同じURLにナビゲートするように、設定可能である。

location.hostname

Locationオブジェクトのホストを返す。

変更されたホストと同じURLにナビゲートするように、設定可能である。

location.port

Locationオブジェクトのポートを返す。

変更されたポートと同じURLにナビゲートするように、設定可能である。

location.pathname

Locationオブジェクトのパスを返す。

変更されたパスと同じURLにナビゲートするように、設定可能である。

location.search

LocationオブジェクトのURLのクエリーを返す（空でない場合は先頭の"?"を含む）。

（先頭の"?"を無視して）変更されたクエリーと同じURLにナビゲートするように、設定可能である。

location.hash

LocationオブジェクトのURLのフラグメントを返す（空でない場合は先頭の"#"を含む）。

（先頭の"#"を無視して）変更されたフラグメントと同じURLにナビゲートするように、設定可能である。

location.assign(url)

与えられたURLにナビゲートする。

location.replace(url)

セッション履歴から現在のページを削除し、与えられたURLにナビゲートする。

location.reload()

現在のページをリロードする。

location.ancestorOrigins

祖先ナビゲート可能のアクティブな文書の生成元を列挙する DOMStringListオブジェクトを返す。

7.2.4 Historyインターフェイス

history.length

現在のトラバース可能なナビゲート可能の全体のセッション履歴エントリーの数を返す。

history.scrollRestoration

アクティブなセッション履歴エントリーのスクロール復元モードを返す。

history.scrollRestoration = value

アクティブなセッション履歴エントリーのスクロール復元モードをvalueに設定する。

history.state

JavaScript値に逆シリアル化された、アクティブなセッション履歴エントリーのシリアル化された状態を返す。

history.go()

現在のページをリロードする。

history.go(delta)

現在のトラバース可能なナビゲート可能の全体のセッション履歴エントリーリストで、指定された数のステップを前後に移動する。

ゼロ差分は、現在のページをリロードする。

差分が範囲外の場合、何もしない。

history.back()

現在のトラバース可能なナビゲート可能の全体のセッション履歴エントリーリストで1ステップ戻る。

前のページが存在しない場合、何もしない。

history.forward()

現在のトラバース可能なナビゲート可能の全体のセッション履歴エントリーリストで1ステップ進める。

次のページが存在しない場合、何もしない。

history.pushState(data, "")

シリアル化された状態をdataのシリアル化に設定して、セッション履歴に新しいエントリーを追加する。アクティブな履歴エントリーのURLがコピーされ、新しいエントリーのURLに使用される。

（2番目のパラメーターは歴史的な理由で存在し、省略することはできない。空の文字列を渡すことは慣例的なものである。）

history.pushState(data, "", url)

シリアル化された状態をdataのシリアル化に設定し、URLをurlに設定して、セッション履歴に新しいエントリーを追加する。

現在のDocumentがURLをurlに書き換えることができない場合、"SecurityError" DOMExceptionが投げられる。

（2番目のパラメーターは歴史的な理由で存在し、省略することはできない。空の文字列を渡すことは慣例的なものである。）

history.replaceState(data, "")

アクティブなセッション履歴エントリーのシリアル化された状態をdataの構造化されたクローンに更新する。

（2番目のパラメーターは歴史的な理由で存在し、省略することはできない。空の文字列を渡すことは慣例的なものである。）

history.replaceState(data, "", url)

アクティブなセッション履歴エントリーのシリアル化された状態をdataの構造化されたクローンに更新し、そのURLをurlに更新する。

現在のDocumentがURLをurlに書き換えることができない場合、"SecurityError" DOMExceptionが投げられる。

（2番目のパラメーターは歴史的な理由で存在し、省略することはできない。空の文字列を渡すことは慣例的なものである。）

<!DOCTYPE HTML>
<!-- this is https://example.com/line?x=5 -->
<html lang="en">
<title>Line Game - 5</title>
<p>You are at coordinate 5 on the line.</p>
<p>
 <a href="?x=6">Advance to 6</a> or
 <a href="?x=4">retreat to 4</a>?
</p>

<!DOCTYPE HTML>
<!-- this starts off as https://example.com/line?x=5 -->
<html lang="en">
<title>Line Game - 5</title>
<p>You are at coordinate <span id="coord">5</span> on the line.</p>
<p>
 <a href="?x=6" onclick="go(1); return false;">Advance to 6</a> or
 <a href="?x=4" onclick="go(-1); return false;">retreat to 4</a>?
</p>
<script>
 var currentPage = 5; // prefilled by server
 function go(d) {
   setupPage(currentPage + d);
   history.pushState(currentPage, "", '?x=' + currentPage);
 }
 onpopstate = function(event) {
   setupPage(event.state);
 }
 function setupPage(page) {
   currentPage = page;
   document.title = 'Line Game - ' + currentPage;
   document.getElementById('coord').textContent = currentPage;
   document.links[0].href = '?x=' + (currentPage+1);
   document.links[0].textContent = 'Advance to ' + (currentPage+1);
   document.links[1].href = '?x=' + (currentPage-1);
   document.links[1].textContent = 'retreat to ' + (currentPage-1);
 }
</script>

<head>
  <script>
       if ('scrollRestoration' in history)
            history.scrollRestoration = 'manual';
  </script>
</head>
   

7.2.5 イベントインターフェイス

7.2.5.1 PopStateEventインターフェイス

event.state

pushState()またはreplaceState()へ提供される情報のコピーを返す。

7.2.5.2 HashChangeEventインターフェイス

event.oldURL

以前に現在であったセッション履歴のエントリーのURLを返す。

event.newURL

今現在であるセッション履歴のエントリーのURLを返す。

7.2.5.3 PageTransitionEventインターフェイス

event.persisted

pageshowに対して、ページが新しく読み込まれている（およびloadイベントが発生する）場合にfalseを返す。そうでなければ、trueを返す。

pagehideイベントに対して、ページが最後の時間まで出かける場合はfalseを返す。そうでなければtrueを返す。これは、ユーザーがこのページに戻った場合（Documentのsalvageable状態がtrueのままの場合）にページが再利用される可能性があることを意味する。

ページがサルベージ不能になる原因には、次のものがある：

• ユーザーエージェントが、アンロード後にセッション履歴エントリーでDocumentを存続させないことを決定した
• salvageableではないiframeを持っている
• アクティブなWebSocketオブジェクト
• Documentの中止

7.2.5.4 BeforeUnloadEventインターフェイス

BeforeUnloadEvent固有の初期化メソッドは存在しない。

BeforeUnloadEventインターフェイスは、イベントをキャンセルするだけでなく、returnValue属性を空文字列以外の値に設定することで、アンロードがユーザーによってキャンセルされたかどうかをチェックできるようにするレガシーインターフェイスである。著者は、returnValueを使用する代わりに、preventDefault()メソッド、またはイベントをキャンセルするその他の手段を使用すべきである。