JavaScriptで表示中のURL情報を取得する方法:location

JavaScriptでは、現在表示しているページのURL情報を取得することができます。

URL情報は、locationオブジェクトに格納されているため、このlocationオブジェクトのプロパティとしてURL情報を取得します。

それでは、具体的にプログラムで見ていきましょう。

表示中のURL情報を取得する

var urlInfo = location.href;
alert(urlInfo );

「http://www.test.com/test/index.html?pgid=100」というURLのページを表示した状態で、上記プログラムを実行すると、次のようになります。

image10_1

また、locationオブジェクトのURL情報にこれから表示したいページを指定すると、指定したページに移動することもできます。

location.href = 'http://test.com/test/kakunin.html?id=test';

上記の例では、「http://test.com/test/kakunin.html?id=test」というURLのページに移動します。

locationオブジェクトから取得できる情報

冒頭で、URL情報はlocationオブジェクトのプロパティと説明しましたが、他にはどんな情報をlocationオブジェクトから取得できるのか紹介します。

①アクセス中のホスト情報

現在アクセスしているホストの情報をlocationオブジェクトのhostまたはhostnameプロパティから取得することができます。

var host = location.host;
alert(host);
var hostname = location.hostname;
alert(hostname);

上記二つのプログラムの実行結果は、いずれも以下のようになります。

image10_2

②アクセス中のパス情報

現在アクセスしているページのパスをlocationオブジェクトのpathプロパティから取得することができます。

var pathname = location.pathname;
alert(pathname);

実行結果は、次のようになります。

image10_3

③アクセス中のページのパラメータ情報

現在アクセスしているページのパラメータ情報(移動する画面に渡す情報)をlocationオブジェクトのプロパティから取得することができます。

var parameter = location.search;
alert(parameter);

実行結果は次のようになります。

image10_4

このように、locationオブジェクトを使うと色々なページ情報を取得したり、locationオブジェクトのプロパティに任意の値を設定することで、ページを移動したりページに値を引き渡したりすることが可能になります。


イベント