ホームページ > ウェブフロントエンド > jsチュートリアル > Locationオブジェクトの使い方

Locationオブジェクトの使い方

不言
リリース: 2019-01-29 16:57:52
オリジナル
4067 人が閲覧しました

Locationオブジェクトの使い方 の Location オブジェクトは、訪問者のブラウザに表示されている現在の URL にアクセスして変更するために使用できます。Location オブジェクト自体は Window オブジェクトのプロパティです。Location オブジェクトの具体的な使用法を見てみましょう。

Locationオブジェクトの使い方

Location オブジェクトは window オブジェクトと document オブジェクトのプロパティであるため、window.location と document.location は同じオブジェクトを指します。

Location オブジェクトのプロパティを見てみましょう。

href: 現在読み込まれているページの完全な URL。

protocol: 現在使用されているプロトコル。

host: サーバー名とポート番号。

hostname: URL のサーバー名、サブドメイン、ドメイン名を示します。

port: 指定したサーバーが使用する通信ポートを示します。

pathname: URL のディレクトリとファイル名。

search: HTTP URL 内のクエリ情報を指定する疑問符で始まる文字列を表します。

hash: # で始まる文字列を表し、HTTP URL のアンカー名を指定します。

具体的な例を見てみましょう

コードは次のとおりです

<!DOCTYPE HTML>
<html>
<head>
	<title>Locationオブジェクトの使い方 Location Object</title>
	<script type="text/javascript">
		function gotoUrl()
		{
			window.location.href = window.document.loctn.ProtocolFld.
			options[window.document.loctn.ProtocolFld.selectedIndex].
			text + document.loctn.HostnameFld.value + document.loctn.
			PathnameFld.value
		}
	</script>
</head>
<body>
<h3>在以下部分输入URL</h3>
<form name="loctn" method="post">
<pre class="brush:php;toolbar:false">协议:
<select name="ProtocolFld" size="1">
<option>http://</option>
<option>file://</option>
<option>javascript:</option>
<option>ftp://</option>
<option>mailto:</option>
</select>
ログイン後にコピー
主机名:
<input type="text" size="20" maxlength="256" name="HostnameFld" value="php.cn">
ログイン後にコピー
路径:
<input type="text" size="20" maxlength="100" name="PathnameFld" value="/">
ログイン後にコピー
<input type="button" name="Go" value="Go" onclick="gotoUrl()">
ログイン後にコピー

実行時の効果は次のとおりです

Locationオブジェクトの使い方

#この記事はここで終わりです。さらにエキサイティングなコンテンツについては、PHP 中国語 Web サイトにある他の関連コラム チュートリアルに注目してください。 ! !

以上がLocationオブジェクトの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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