Location - ロケーション
Locationは、ロケーションの情報を調べたり、操作するための機能を備えたインターフェイスです。
概要
- 名前
- Location
- IDL
[Exposed=Window] interface Location { // but see also additional creation steps and overridden internal methods [Unforgeable] stringifier attribute USVString href; [Unforgeable] readonly attribute USVString origin; [Unforgeable] attribute USVString protocol; [Unforgeable] attribute USVString host; [Unforgeable] attribute USVString hostname; [Unforgeable] attribute USVString port; [Unforgeable] attribute USVString pathname; [Unforgeable] attribute USVString search; [Unforgeable] attribute USVString hash; [Unforgeable] void assign(USVString url); [Unforgeable] void replace(USVString url); [Unforgeable] void reload(); [Unforgeable, SameObject] readonly attribute DOMStringList ancestorOrigins; };
- 仕様書
- https://html.spec.whatwg.org/multipage/history.html#location
チュートリアル
LocationはWindow.location、Document.locationから取得できます。
window.location ;
document.location ;
location ; // windowは省略できるので、locationでそのまま使える
各情報を調べることができます。
// https://syncer.jp/index.html?page=100#hoge
location.href ; // 完全なアドレス ("https://syncer.jp/index.html?page=100#hoge")
location.pathname ; // パス ("/index.html")
location.hash ; // ハッシュ ("#hoge")
location.search ; // クエリ ("?page=100")
location.protocol ; // プロトコル ("https:")
location.hostname ; // ホスト ("syncer.jp")
Location.hrefにはstringifier属性があります。Locationを文字列として取り扱う時、Location.hrefと同じ値になります。下記は同じ出力となります。
element.textContent = location.href ;
element.textContent = location ;
値を代入する時も同様です。
location.href = "https://syncer.jp/" ; // "https://syncer.jp/"に遷移
location = "https://syncer.jp/" ; // "https://syncer.jp/"に遷移
コンストラクタ
コンストラクタはありません。
プロパティ
ancestorOrigins
ロケーションの全ての祖先オリジンを含むDOMStringListを返します。
hash
ロケーションのハッシュを返します。
host
ロケーションのホスト名とポート番号を返します。
hostname
ロケーションのホスト名を返します。
href
ロケーションの完全なアドレスを返します。
origin
ロケーションのオリジンを返します。
pathname
ロケーションのパス名を返します。
port
ロケーションのポート番号を返します。
protocol
ロケーションのプロトコルを返します。
search
ロケーションのクエリを返します。
メソッド
assign()
新しいロケーションに遷移させます。hrefに値を代入するのと同じです。
reload()
現在のロケーションを再読み込みします。
replace()
新しいロケーションに遷移させます。ただし、履歴エントリーは追加されずに、現在の履歴エントリーと置き換わります。
定数
固有の定数はありません。
イベント
固有のイベントハンドラはありません。
サポート状況
クリックすると、バージョンごとの対応状況を確認できます。
Features | Chrome | Firefox | Safari | Edge | IE | Opera | iOS Safari | Android |
---|---|---|---|---|---|---|---|---|
Location | ● | ● | ● | ● | ● | ● | ● | ● |
ancestorOrigins | ● 20+ | × | ● 6.0+ | × | × | ● 15+ | ● 6.0+ | ● 4.4+ |
assign() | ● | ● | ● | ● | ● | ● | ● | ● |
hash | ● | ● | ● | ● | ● | ● | ● | ● |
host | ● | ● | ● | ● | ● | ● | ● | ● |
hostname | ● | ● | ● | ● | ● | ● | ● | ● |
href | ● | ● | ● | ● | ● | ● | ● | ● |
origin | ● | ● 21+ | ● 5.1+ | ● | ● 11+ | ● 15+ | ● | ● 4.0+ |
pathname | ● | ● | ● | ● | ● | ● | ● | ● |
port | ● | ● | ● | ● | ● | ● | ● | ● |
protocol | ● | ● | ● | ● | ● | ● | ● | ● |
reload() | ● | ● | ● | ● | ● | ● | ● | ● |
replace() | ● | ● | ● | ● | ● | ● | ● | ● |
search | ● | ● | ● | ● | ● | ● | ● | ● |
関連記事
- DOMStringList
- DOMStringListは、文字列のリストを管理するのに便利な機能を備えたインターフェイスです。
- Range()
- Range()は、Rangeのコンストラクタです。新しいオブジェクトを作成します。
- UIEvent()
- UIEvent()は、UIEventのコンストラクタです。新しいオブジェクトを作成します。
- DragEvent()
- DragEvent()は、DragEventのコンストラクタです。新しいオブジェクトを作成します。