こんにちは、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