locationオブジェクトはWindowオブジェクトの一部であり、window.locationプロパティを通じてアクセスできる。

プロパティ

locationオブジェクトのプロパティ
プロパティ 説明
hash URLのアンカー部分
host URLのホスト名とポート番号
hostname URLのホスト名
href URL全体
pathname URLのパス名
port URL用にサーバが使用するポート番号
protocol URLのプロトコル
search URLのクエリ部分

メソッド

locationオブジェクトのメソッド
メソッド 説明
assign 新規文書のロード
reload 現在の文書のリロード
replace 現在の文書を新しいものに置き換える。

hostプロパティ

URLのホスト名とポート番号

<script>
  document.writeln(location.host);
</script>

上記JavaScriptの実行結果を次に示す。

hostnameプロパティ

URLのホスト名

<script>
  document.writeln(location.hostname);
</script>

上記JavaScriptの実行結果を次に示す。

hrefプロパティ

URL全体

<script>
  document.writeln(location.href);
</script>

上記JavaScriptの実行結果を次に示す。

hrefプロパティに値を設定すると、そのURLに遷移する。

<p onclick="location.href='http://itref.fc2web.com'">
ここをクリックすると、トップページへ遷移します。
</p>

上記JavaScriptの実行結果を次に示す。

ここをクリックすると、トップページへ遷移します。

pathnameプロパティ

URLのパス名

<script>
  document.writeln(location.pathname);
</script>

上記JavaScriptの実行結果を次に示す。

portプロパティ

URL用にサーバが使用するポート番号

<script>
  document.writeln(location.port);
</script>

上記JavaScriptの実行結果を次に示す。

protocolプロパティ

URLのプロトコル

<script>
  document.writeln(location.protocol);
</script>

上記JavaScriptの実行結果を次に示す。

URLのクエリ部分

<script>
  document.writeln(location.search);
</script>

上記JavaScriptの実行結果を次に示す。

SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送