Obtenir la valeur du href local à partir de la balise d'ancrage (a)

Question

J'ai une balise d'ancrage qui a une valeur href locale, et une fonction JavaScript qui utilise la valeur href mais la dirige vers un endroit légèrement différent de celui où elle devrait normalement aller. La balise ressemble à

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

et une fonction JavaScript qui ressemble à

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

Je m'attendrais à ce que item.href ne renverrait que la chaîne courte "sec/IF00.html", mais au lieu de cela, il renvoie le href complet, "http://www.thecurrentdomain.com/sec/IF00.html". Existe-t-il un moyen d'extraire uniquement l'adresse courte telle que définie dans l'ancre ? <a> étiquette ? Ou est-ce que je perds cela par le comportement naturel du HTML ?

Je suppose que je pourrais utiliser une manipulation de chaîne pour faire cela, mais cela devient délicat parce que ma page locale peut en fait être "http://www.thecurrentdomain.com/somedir/somepath/sec/IF00.html", et mon champ href peut ou non contenir un sous-répertoire (par ex. href="page.html" vs. href="sub/page.html" ), je ne peux donc pas toujours supprimer tout ce qui se trouve avant la dernière barre oblique.

Vous vous demandez peut-être pourquoi je demande cela, et c'est parce que cela rendra la page beaucoup plus propre. S'il n'est pas possible d'obtenir seulement le href court (tel que mis dans l'ancre <a> ), je pourrais probablement insérer un champ supplémentaire dans la balise, comme suit link="sec/IF00.html" mais là encore, ce serait un peu plus compliqué.

Answer 1

Le code ci-dessous obtient le chemin complet, où les points d'ancrage :

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

tandis que celui qui se trouve en dessous obtient la valeur de l'élément href attribut :

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

Answer 2

document.getElementById("link").getAttribute("href"); Si vous avez plus d'un <a> par exemple :

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

Vous pouvez le faire comme ça : document.getElementById("link")[0].getAttribute("href"); pour accéder au premier tableau de <a> ou dépend de la condition que vous faites.

Answer 3

Ce code fonctionne pour moi pour obtenir tous les liens du document

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

Answer 4

Dans mon cas, j'avais un href avec un # et target.href me renvoyait l'url complète. Target.hash a fait le travail pour moi.

$(".test a").on('click', function(e) {
    console.log(e.target.href); // logs https://www.test.com/#test
    console.log(e.target.hash); // logs #test
  });

Answer 5

La propriété href définit ou renvoie la valeur de l'attribut href d'un lien.

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