web-dev-qa-db-ja.com

アンカー（a）タグからローカルhref値を取得する

ローカル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」の短い文字列を返すだけですが、代わりに完全なhref、「http://www.thecurrentdomain.com/sec/IF00.html」を返します。アンカー<a>タグに入れた短いhrefだけを引き出す方法はありますか？または、自然なHTMLの動作によってそれを失いますか？

文字列操作を使用してこれを行うことができると思いますが、ローカルページが実際に「http://www.thecurrentdomain.com/somedir/somepath/sec/IF00.html」であり、hrefフィールドがまたはサブディレクトリが含まれていない場合があります（たとえば、href="page.html"対href="sub/page.html"）。したがって、最後のスラッシュの前にあるすべてのものを常に削除することはできません。

なぜ私がこれを要求しているのか疑問に思うかもしれませんが、それは単にページをずっときれいにするからです。 （アンカー<a>タグに入れて）短いhrefだけを取得できない場合は、おそらくlink="sec/IF00.html"のような追加フィールドをタグに挿入することもできますが、これも少し面倒です。

javascripthtmlhref
90
Michael Plautz

以下のコードは、アンカーが指す完全なパスを取得します。

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

一方、以下のものはhref属性の値を取得します：

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

document.getElementById("link").getAttribute("href");複数の<a>タグがある場合、例えば：

<ul>
  <li>
    <a href="1"></a>
  </li>
  <li>
    <a href="2"></a>
  </li>
  <li>
    <a href="3"></a>
  </li>
</ul>

次のようにできます：document.getElementById("link")[0].getAttribute("href");は、<a>タグの最初の配列にアクセスするか、作成する条件に依存します。

6
Zange-chan

このコードは、ドキュメントのすべてのリンクを取得するのに役立ちます

var links=document.getElementsByTagName('a'), hrefs = [];
for (var i = 0; i<links.length; i++)
{   
    hrefs.Push(links[i].href);
}
1
nazifa rashid

Hrefプロパティは、リンクのhref属性の値を設定または返します。

  var hello = domains[i].getElementsByTagName('a')[0].getAttribute('href');
    var url="https://www.google.com/";
    console.log( url+hello);
0
M.Ganji