ホームページ > 記事 > ウェブフロントエンド > JSのwindow.locationオブジェクトの詳しい説明(チートシート)
サイトの URL 情報を取得したい場合は、window.location
オブジェクトが適しています。そのプロパティを使用して現在のページ アドレスに関する情報を取得するか、そのメソッドを使用してページのリダイレクトやリフレッシュを実行します
window.location.origin → '"https://segmentfault.com' .protocol → 'https:' .host → 'segmentfault.com' .hostname → 'segmentfault.com' .port → '' .pathname → '/search' .search → '?q=前端小智' .hash → '#2' .href → 'https://segmentfault.com/search?q=前端小智#2'
window.location.assign('url') .replace('url') .reload() .toString()
window.location | 戻り値 |
---|---|
.origin | サイトのメインアドレス (プロトコルホスト名ポート) ) |
.protocol | プロトコル アーキテクチャ (http: または htts: ) |
ドメイン名 port | |
Port | |
最初のページの「/」に続くパス | |
? 続くクエリ文字列 | |
|
|
完全な URL | ## から始まる部分 |
と hostname
同じ値を返します。では、なぜこれらの特性があるのでしょうか。さて、ポート番号の話なので見てみましょう。
ポートなしの URL
https://segmentfault.com/searchwindow.location.host; // 'segmentfault.com' window.location.hostname; // 'segmentfault.com' window.location.port; // ''
ポート付きの URLhttps://segmentfault.com/search"8080
にはポート番号が含まれますが、window.location.host; // 'segmentfault.com:8080' window.location.hostname; // 'segmentfault.com' window.location.port; // '8080'したがって、
host
hostname にはホスト名のみが返されます。
##URL プロパティの変更方法
// 开始 'https://segmentfault.com/' window.location.pathname = '/tidbits'; // 设置 pathname // 结果 'https://segmentfault.com/tidbits'変更できるプロパティの完全なリストは次のとおりです
// 事例 window.location.protocol = 'https' .host = 'localhost:8080' .hostname = 'localhost' .port = '8080' .pathname = 'path' .search = 'query string' // (这里不用写 `?`) .hash = 'hash' // (这里不用写 `#`) .href = 'url'
window.location.origin
です。window.location
Location
window.location → Location window.document.location → Location document.location → Location location → Locationこれを行う理由は、これらがブラウザのグローバル変数であるためです。
window .location と location
Location
オブジェクトを指します。私は個人的にwindow.location を好み、実際には避けます。
location// https://www.samanthaming.com location.protocol; // 'https' function localFile() { const location = '/sam'; return location.protocol; // undefined // b/c local "location" has override the global variable }ほとんどの開発者は、
がグローバル変数であることを知っていると思います。そうすれば、混乱を引き起こす可能性が低くなります。正直に言うと、この記事を書くまで、location## について知りませんでした #はグローバル変数です。他の記述方法ではなく、
window.location を使用することをお勧めします。
window.location メソッド
##メソッド
関数
現在のドキュメントを新しいドキュメントに置き換えます | |
---|---|
.reload() | |
以上がJSのwindow.locationオブジェクトの詳しい説明(チートシート)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。