jQueryでURLを取得する方法もいくつかあります。
URL全部を取得するだけでなく、http://の部分やホスト（ドメイン）、?以降のパラメータやページ内リンクで付いた#のハッシュ値まで取得できます。
現在のURLは以下で想定しています。
http://www.flatflag.nir87.com/test.php?id=321#id
URL全体を取得する
基本構文
jQuery
$(location).attr(‘href’)
ちなみにjavascriptは以下のようになります。
javascript
location.href
javascript の手法はよく使いますね。
URLを表示させるサンプル
HTMLの<p>要素にtext()で現在のURLを表示させてみましょう。
|
1 2 3 4 5 |
$(function() { // <p>要素にURLを表示させる $('p').text(location.href); }); |
結果
http://www.flatflag.nir87.com/test.php?id=321#id
http://から最後のパラメータまで、URLが全て表示されました。
URLの一部分のみを取得
次にURLのそれぞれの部分のみを取得します。
jQueryのattr()を使って取得します。
ホスト名（ドメイン）
|
1 |
$(location).attr('host'); |
www.flatflag.nir87.com
プロトコル
|
1 |
$(location).attr('protocol'); |
http:
ドメイン以下のパス
|
1 |
$(location).attr('pathname'); |
/test.php
パラメータ
|
1 |
$(location).attr('search'); |
?id=321
ハッシュ（アンカー）
|
1 |
$(location).attr('hash'); |
#id
構文
下記のようにattr()の引数に取得したいプロパティを指定し、取得します。
$(location).attr( プロパティ );
サンプル
取得した結果をtext()で<p>要素に表示させています。
|
1 2 |
//p要素にホスト名を出力 $('p').text($(location).attr('host')); |
www.flatflag.nir87.com
