Location オブジェクト

Window Locationオブジェクト

Location オブジェクトは現在の URL の情報を含んでいます。

Location オブジェクトはウィンドウオブジェクトの属性です。

Location オブジェクトは以下のようにアクセスされます：

window.location またはただ location

インスタンス

let origin = window.location.origin;

自分で試してみてください

let origin = location.origin;

自分で試してみてください

Locationオブジェクトの属性

属性 説明
hash URLのハッシュ部分（#）を設定または返します。
host ホスト名とポート番号を設定または返します。
hostname ホスト名を設定または返します。
href 全体のURLを設定または返します。
origin URLのプロトコル、ホスト名、ポート番号を返します。
pathname URLのパス名を設定または返します。
port URLのポート番号を設定または返します。
protocol URLのプロトコルを設定または返します。
search URLのクエリ文字列部分を設定または返します。

Locationオブジェクトのメソッド

メソッド 説明
assign() 新しいドキュメントをロードします。
reload() 現在のドキュメントを再読み込みします。
replace() 現在のドキュメントを新しいドキュメントで置き換えます。

Locationオブジェクトの説明

LocationオブジェクトはWindowオブジェクトのLocation属性に保存されており、そのウィンドウで現在表示されているドキュメントのWebアドレスを表します。その href属性はドキュメントの完全なURLを保存しており、他の属性はURLの各部分を説明しています。これらの属性はAnchorオブジェクト（またはAreaオブジェクト）のURL属性と非常に似ています。Locationオブジェクトが文字列に変換された場合、href属性の値が返されます。これは、location.hrefをlocationとして使用できることを意味します。

ただし、Anchorオブジェクトはドキュメント内のハイパーリンクを表すものであり、Locationオブジェクトはブラウザが現在表示しているドキュメントのURL（または位置）を表しています。しかし、Locationオブジェクトはこれ以上のことができます。ブラウザが表示するドキュメントの位置を制御することもできます。URLを含む文字列をLocationオブジェクトまたはそのhref属性に割り当てると、ブラウザは新しいURLに指定されたドキュメントをロードし表示します。

locationやlocation.hrefを完全なURLで置き換える他にも、Locationオブジェクトの他の属性に値を設定することで部分URLを変更できます。これにより、元のURLの一部が異なる新しいURLが作成され、ブラウザがそれをロードし表示します。例えば、Locationオブジェクトの hash属性、それでは、ブラウザは現在のドキュメント内の指定された位置に移動します。同様に、設定された search プロパティ、その場合、ブラウザは新しいクエリ文字列が付加された URL を再読み込みします。

URL プロパティ以外の Location オブジェクトの reload() メソッド現在のドキュメントを再読み込みする方法replace() 新しいドキュメントをロードする場合でも新しいヒストリを生成する必要はなく、つまり、ブラウザのヒストリリストでは新しいドキュメントが現在のドキュメントに置き換わるという意味です。