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