こんにちは、Ryohei（@ityryohei）です！

locationで良く取得する値をまとめました。JavascriptとjQueryでの取得方法を記載しています。以下のURLを例としています。

  http://into-the-program.com/url.html?test=home#hash

URL全体を取得する

閲覧ページのURLを全て取得します。

Javascript location.href
jQuery $( location ).attr('href');
取得情報 http://into-the-program.com/url.html?test=home#hash

プロトコル取得

閲覧ページのプロトコルを取得します。

Javascript location.protocol
jQuery $( location ).attr('protocol');
取得情報 http:

ホスト情報取得

閲覧ページのホスト名とポート番号を取得します。

Javascript location.host
jQuery $( location ).attr('host');
取得情報 into-the-program.com:8080

ホスト名取得

閲覧ページのホスト名を取得します。

Javascript location.hostname
jQuery $( location ).attr('hostname');
取得情報 into-the-program.com

ポート番号取得

閲覧ページのポート番号を取得します。

Javascript location.port
jQuery $( location ).attr('port');
取得情報 8080

パス取得

閲覧ページまでのパス情報を取得します。

Javascript location.pathname
jQuery $( location ).attr('pathname');
取得情報 /url.html

パラメータ取得

閲覧ページの「?」から続くパラメータの値を取得します。

Javascript location.search
jQuery $( location ).attr('search');
取得情報 ?test=home

ハッシュ取得

閲覧ページのハッシュ (#) の値を取得します。

Javascript location.hash
jQuery $( location ).attr('hash');
取得情報 #hash
この記事を書いた人

Ryohei

Webエンジニア / ブロガー

福岡のWeb制作会社に務めるWebエンジニアです。エンジニア歴は10年程で、好きな言語はPHPとJavaScriptです。本サイトは私がインプットしたWebに関する知識を整理し、共有することを目的に2015年から運営しています。Webに関するご相談があれば気軽にお問い合わせください。

お問い合わせはこちら