HTMLドキュメントのlocationオブジェクト属性の理解と一般的な使用法_基礎知識

WBOY
リリース: 2016-05-16 16:39:43
オリジナル
1706 人が閲覧しました

位置オブジェクトの簡単な理解:

1. location オブジェクトは現在のページ (このページ)、またはより直接的には現在ロードされている HTML ドキュメントの URL 情報をカバーします

2. location オブジェクトは window オブジェクトの属性であり、window.location

を通じてアクセスできます。

ところで、URL (リソースロケーター) についていくつかの情報を紹介しましょう:

ブラウザでは、URL は通常次の部分で構成されます:

[プロトコル][ホスト][パス][クエリ]

プロトコル: 一般的なプロトコルは次のとおりです:

http:// は、リソース ファイルが Web サーバー上にあることを示します

ftp:// は、リソース ファイルがネットワーク上の FTP サーバーにあることを示します

host: ローカル Tomcat で一般的に使用されるホストなどのホスト名とポート番号: localhost:8080

パス: プロジェクトのパス情報。通常は「/」と文字で構成されます。「/」は上位と下位の関係を表します

クエリ: 通常は「?」で始まり、その後にいくつかのキーと値のペア (key=value) が続きます。動的 Web ページでパラメータを渡すために使用できます。サーバー側では、バックグラウンド操作、データベース条件のクエリなど、フォームデータの送信などに使用でき、セキュリティに関係するものは暗号化するか、他の方法で送信する必要があります。 。 。 。

クエリの後に「#」で始まるパラメータを追加することもできますが、これは現在使用されていないため、当面は気軽にコメントしません

位置オブジェクト属性:

1.href 属性: プロトコル、ホスト名、ポート番号、クエリ パラメーター、#information など、現在のページの完全な URL 情報がすべて含まれます

2.host 属性: ホスト名とポート番号 (localhost:8080 ローカル マシンなど)

3.hostname: ホスト名

4.port: URL 内のポート番号

5.pathname: URL 内のパス内容の「/」を含む部分

6.プロトコル:プロトコル

7.serach: 「?」で始まるクエリ部分

8.hash: 「#」で始まるコンテンツ

位置情報の一般的な使用法

明らかに、開発者に便利な属性情報を提供することに加えて、より重要で一般的な用途もあります

ページのリロードはドキュメントのコンテンツを更新するために使用できますが、より重要な目的は、href 情報を変更した後にドキュメントのコンテンツをリロードすることです

location.href: 割り当て後、ブラウザは指定された新しい URL

に従ってドキュメントのコンテンツを更新します。

location.reload(): ドキュメントをリロードします

クロスドメイン ページの問題の解決にご協力ください:

1. 現在のページを更新します

window.location.href =url//この方法の使用には慣れています

self.location.href =url

location.href =url

上記の 3 つの方法はすべて、現在のページを更新するために使用できます (指定された URL に従って再読み込みします。これは、現在のドキュメントを置き換える別の新しいドキュメントになる可能性があります)

2. 親ページが子ページをインクルードするために iframe を使用する場合

親ページが子ページを更新します:

window.frames["id"].location.reload()//id はページ内の iframe の ID です

3. 子ページが親ページを更新します

parant.location.reload()

self.opener.location.reload()

たくさんの方法があるので、今後も実際に使いながらまとめていきます! ! ! !

その他の一般的な方法:

location.replace() //現在のドキュメントを新しいドキュメントで置き換えます

location.assign() //新しいドキュメントをロード

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート