Location
インターフェイスは、関連付けられたオブジェクトの場所 (URL) を表します。 Location
に対して変更が行われると、関連するオブジェクトに反映されます。 Document
インターフェイスおよび Window
インターフェイスにはこのような関連付けられた Location
があり、それぞれ Document.location
および Window.location
でアクセスできます。
プロパティ
Location.href
- URL 全体を収めた
USVString
を返す文字列化です。この値を変更すると、関連付けられた文書が新しいページへ移動します。この値は、関連付けられた文書のものとは異なるオリジンから設定できます。 Location.protocol
- 末尾の
':'
を含む、URL のプロトコルスキームを収めたUSVString
です。 Location.host
- URL のホスト (すなわち hostname、コロン (
':'
)、port) を収めたUSVString
です。 Location.hostname
- URL のドメインを収めた
USVString
です。 Location.port
- URL のポート番号を収めた
USVString
です。 Location.pathname
- URL のパス部分を、先頭の
'/'
を含めて収めたUSVString
です。 Location.search
- URL のうち、
'?'
とそれに続くパラメーターや "クエリー文字列" を収めたUSVString
です。現代のブラウザーは、クエリー文字列からパラメーターを容易に解析するための URLSearchParams や URL.searchParams を提供しています。 Location.hash
- URL のうち、
'#'
とそれに続くフラグメント識別子を収めたUSVString
です。 Location.username
- ドメイン名の前に指定されたユーザー名を収めた
USVString
です。 Location.password
- ドメイン名の前に指定されたパスワードを収めた
USVString
です。 Location.origin
読取専用- 特定の location のオリジンの標準形を収めた
USVString
です。
メソッド
Location.assign()
- 引数で指定した URL のリソースを読み込みます。
Location.reload()
- 現在の URL のリソースを再読み込みします。省略可能な唯一の引数は
Boolean
値で、true
であれば常にサーバーからページを再読み込みします。false
を指定するか値を指定しない場合は、ブラウザーがキャッシュからページを再読み込みする可能性があります。 Location.replace()
- 現在のリソースを、指定した URL のリソースで置き換えます。
assign()
メソッドとの違いは、replace()
を使用した後は現在のページがセッションのHistory
に保存されないことであり、ユーザーは 戻る ボタンを使用して移動することができません。 Location.toString()
- URL 全体を収めた
USVString
を返します。これはHTMLHyperlinkElementUtils.href
と同義ですが、こちらは値を変更するために使用できません。
例
// この例のためにアンカー要素を生成して、href プロパティを使用します。
// より適切な代替手段は、URL を見て document.location または window.location を使用することです。
var url = document.createElement('a');
url.href = 'https://developer.mozilla.org:8080/en-US/search?q=URL#search-results-close-container';
console.log(url.href); // https://developer.mozilla.org:8080/en-US/search?q=URL#search-results-close-container
console.log(url.protocol); // https:
console.log(url.host); // developer.mozilla.org:8080
console.log(url.hostname); // developer.mozilla.org
console.log(url.port); // 8080
console.log(url.pathname); // /en-US/search
console.log(url.search); // ?q=URL
console.log(url.hash); // #search-results-close-container
console.log(url.origin); // https://developer.mozilla.org:8080
仕様書
仕様書 | 状態 | 備考 |
---|---|---|
HTML Living Standard Location の定義 |
現行の標準 | HTML5 から変更なし。 |
HTML5 Location の定義 |
勧告 | 初回定義 |
ブラウザーの互換性
BCD tables only load in the browser
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
関連情報
- このようなオブジェクトを生成する 2 つの手段:
Window.location
およびDocument.location
- URL 関連のインターフェイス:
URL
,URLSearchParams
,HTMLHyperlinkElementUtils