1. TOP>
2. JavaScript Tips>
3. aタグから絶対パスでURLを取得する

aタグから絶対パスでURLを取得する

jQueryで、aタグからURLを取得しようとしてattrメソッドでhref属性を取得したら、想定外のパスが返ってきたことはないだろうか。ブラウザでそのリンクをマウスオーバーすると絶対パスのURLを確認できると思うが、実際には当該aタグのhref属性は相対パスで書かれていることがままある。

attrメソッドでaタグのhref属性を取得すると、そこに書いてあるそのままが返ってくる。つまり、href属性が相対パスで書いてあればそれをそのまま取得できるのがattrメソッドである。

	<a id="link1" href="/javascript/list.php">JavaScript Tips</a>

	// attrメソッドでhref属性を取得
	console.log('attr: ' + $('#link1').attr('href'));

attr: /javascript/list.php

これに対して、propメソッドでhref属性を取得すれば、"http://"等で始まる絶対パスを得られるようだ。これを利用すれば、相対パスで書かれたaタグから絶対パスのURLを取得することができる。必要に応じてattrメソッドとpropメソッドを使い分けよう。

	// propメソッドでhref属性を取得
	console.log('prop: ' + $('#link1').prop('href'));

prop: http://www.office-matsunaga.biz/javascript/list.php

• .attr()
• .prop()