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


121

ローカルの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フィールドがまたは、その中にサブディレクトリがない場合があります(ex href="page.html"vsの場合href="sub/page.html")。最後のスラッシュの前にあるすべてのものを常に削除できるわけではありません。

なぜ私がこれを要求しているのか不思議に思うかもしれませんが、それは単にページをよりきれいにするだけだからです。(anchor <a>タグに挿入された)短いhrefだけを取得できない場合は、おそらくのようlink="sec/IF00.html"にタグに追加のフィールドを挿入できますが、ここでも少し面倒です。

回答:


255

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

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

下記のものはhref属性の値を取得します:

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

6

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>か、作成する条件に依存します。


2

このコードは、ドキュメントのすべてのリンクを取得するために機能します

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

0

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

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

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

2
OPはすでにそれを試しましたが、それは彼に望ましい結果を与えません。
Bobort 2016
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.