blob: feb977ab29ea64e40d5bb0d262f9cc1d8795742c (
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
|
---
title: Location
slug: Web/API/Location
tags:
- API
- HTML DOM
- Interface
- Location
- Reference
- インターフェイス
translation_of: Web/API/Location
---
<div>{{APIRef("HTML DOM")}}</div>
<p><strong><code>Location</code></strong> インターフェイスは、関連付けられたオブジェクトの場所 (URL) を表します。 <code>Location</code> に対して変更が行われると、関連するオブジェクトに反映されます。 {{domxref("Document")}} インターフェイスおよび {{domxref("Window")}} インターフェイスにはこのような関連付けられた <code>Location</code> があり、それぞれ {{domxref("Document.location")}} および {{domxref("Window.location")}} でアクセスできます。</p>
<h2 id="Properties" name="Properties">プロパティ</h2>
<dl>
<dt>{{domxref("Location.href")}}</dt>
<dd>URL 全体を収めた {{domxref("USVString")}} を返す文字列化です。この値を変更すると、関連付けられた文書が新しいページへ移動します。この値は、関連付けられた文書のものとは異なるオリジンから設定できます。</dd>
<dt>{{domxref("Location.protocol")}}</dt>
<dd>末尾の <code>':'</code> を含む、URL のプロトコルスキームを収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.host")}}</dt>
<dd>URL のホスト (すなわち <em>hostname</em>、コロン (<code>':'</code>)、<em>port</em>) を収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.hostname")}}</dt>
<dd>URL のドメインを収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.port")}}</dt>
<dd>URL のポート番号を収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.pathname")}}</dt>
<dd>URL のパス部分を、先頭の <code>'/'</code> を含めて収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.search")}}</dt>
<dd>URL のうち、<code>'?'</code> とそれに続くパラメーターや "クエリー文字列" を収めた {{domxref("USVString")}} です。現代のブラウザーは、クエリー文字列からパラメーターを容易に解析するための <a href="/ja/docs/Web/API/URLSearchParams/get#Example">URLSearchParams</a> や <a href="/ja/docs/Web/API/URL/searchParams#Example">URL.searchParams</a> を提供しています。</dd>
<dt>{{domxref("Location.hash")}}</dt>
<dd>URL のうち、<code>'#'</code> とそれに続くフラグメント識別子を収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.username")}}</dt>
<dd>ドメイン名の前に指定されたユーザー名を収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.password")}}</dt>
<dd>ドメイン名の前に指定されたパスワードを収めた {{domxref("USVString")}} です。</dd>
<dt>{{domxref("Location.origin")}} {{readOnlyInline}}</dt>
<dd>特定の location のオリジンの標準形を収めた {{domxref("USVString")}} です。</dd>
</dl>
<h2 id="Methods" name="Methods">メソッド</h2>
<dl>
<dt>{{domxref("Location.assign()")}}</dt>
<dd>引数で指定した URL のリソースを読み込みます。</dd>
<dt>{{domxref("Location.reload()")}}</dt>
<dd>現在の URL のリソースを再読み込みします。省略可能な唯一の引数は {{domxref("Boolean")}} 値で、<code>true</code> であれば常にサーバーからページを再読み込みします。<code>false</code> を指定するか値を指定しない場合は、ブラウザーがキャッシュからページを再読み込みする可能性があります。</dd>
<dt>{{domxref("Location.replace()")}}</dt>
<dd>現在のリソースを、指定した URL のリソースで置き換えます。<code>assign()</code> メソッドとの違いは、<code>replace()</code> を使用した後は現在のページがセッションの {{domxref("History")}} に保存されないことであり、ユーザーは <em>戻る</em> ボタンを使用して移動することができません。</dd>
<dt>{{domxref("Location.toString()")}}</dt>
<dd>URL 全体を収めた {{domxref("USVString")}} を返します。これは {{domxref("HTMLHyperlinkElementUtils.href")}} と同義ですが、こちらは値を変更するために使用できません。</dd>
</dl>
<h2 id="Examples" name="Examples">例</h2>
<pre class="brush: js">// この例のためにアンカー要素を生成して、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
</pre>
<h2 id="Specifications" name="Specifications">仕様書</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">仕様書</th>
<th scope="col">状態</th>
<th scope="col">備考</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('HTML WHATWG', "browsers.html#the-location-interface", "Location")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>{{SpecName("HTML5 W3C")}} から変更なし。</td>
</tr>
<tr>
<td>{{SpecName('HTML5 W3C', "browsers.html#the-location-interface", "Location")}}</td>
<td>{{Spec2('HTML5 W3C')}}</td>
<td>初回定義</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
<p>{{Compat("api.Location")}}</p>
<h2 id="See_also" name="See_also">関連情報</h2>
<ul>
<li>このようなオブジェクトを生成する 2 つの手段: {{domxref("Window.location")}} および {{domxref("Document.location")}}</li>
<li>URL 関連のインターフェイス: {{domxref("URL")}}, {{domxref("URLSearchParams")}}, {{domxref("HTMLHyperlinkElementUtils")}}</li>
</ul>
|
