1. ホーム
  2. javascript

[解決済み] アンカー(a)タグからローカルhref値を取得する。

2022-02-04 22:17:47

質問

ローカルなhref値を持つアンカータグと、そのhref値を使用し、通常とは少し異なる場所に誘導するJavaScript関数を持っています。 タグは次のようなものです。

<a onclick="return follow(this);" href="sec/IF00.html"></a>

というようなJavaScriptの関数があります。

baseURL = 'http://www.someotherdomain.com/';
function follow(item) {
    location.href = baseURL + item.href;
}

と予想されます。 item.href は、単に "sec/IF00.html" という短い文字列を返しますが、その代わりに "http://www.thecurrentdomain.com/sec/IF00.html" という完全な href が返されます。 アンカーに置かれた短いhrefだけを取り出す方法はありますか? <a> タグを使用することはできますか? それとも、HTMLの自然な動作でそれを失ってしまうのでしょうか?

文字列操作でこれを行うことができると思いますが、ローカルページが実際には "http://www.thecurrentdomain.com/somedir/somepath/sec/IF00.html" で、href フィールドにサブディレクトリがあるかないかなので厄介です(例えば href="page.html" vs. href="sub/page.html" のように、最後のスラッシュの前にあるものをすべて削除するわけにはいきません。

なぜこんなことを要求しているのかと思われるかもしれませんが、それだけでもページがすっきりするからです。 もし、短い href (アンカーである <a> タグ) に追加フィールドを挿入することができるかもしれません。 link="sec/IF00.html" しかし、これもまた、少し面倒です。

解決方法は?

以下のコードは、アンカーがポイントしているフルパスを取得します。

document.getElementById("aaa").href; // http://example.com/sec/IF00.html

の値を取得するのに対して、下のものは href 属性で指定します。

document.getElementById("aaa").getAttribute("href"); // sec/IF00.html