Obtener el valor href local de la etiqueta ancla (a)

121

Tengo una etiqueta de anclaje que tiene un valor href local y una función de JavaScript que usa el valor href pero lo dirige a un lugar ligeramente diferente al que iría normalmente. La etiqueta se parece a

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

y una función de JavaScript que se parece a

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

Esperaría que item.hrefsolo devolviera una cadena corta de "sec / IF00.html", pero en su lugar devuelve el href completo, "http://www.thecurrentdomain.com/sec/IF00.html". ¿Hay alguna manera de que pueda extraer solo el href corto como se coloca en la <a>etiqueta de anclaje ? ¿O lo pierdo por el comportamiento HTML natural?

Supongo que podría usar una manipulación de cadenas para hacer esto, pero se vuelve complicado porque mi página local puede ser "http://www.thecurrentdomain.com/somedir/somepath/sec/IF00.html", y mi campo href puede o puede que no tenga un subdirectorio (por ejemplo, href="page.html"vs. href="sub/page.html"), por lo que no siempre puedo eliminar todo antes de la última barra.

Quizás se pregunte por qué solicito esto, y es porque simplemente hará que la página sea mucho más limpia. Si no es posible obtener solo el href corto (como se coloca en la <a>etiqueta de anclaje ), entonces probablemente podría simplemente insertar un campo adicional en la etiqueta, como link="sec/IF00.html", pero nuevamente, eso sería un poco más complicado.

Michael Plautz
fuente

Respuestas:

255

El siguiente código obtiene la ruta completa, donde los puntos de anclaje:

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

mientras que el siguiente obtiene el valor del hrefatributo:

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

document.getElementById("link").getAttribute("href"); Si tiene más de una <a>etiqueta, por ejemplo:

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

Puede hacerlo así: document.getElementById("link")[0].getAttribute("href");para acceder a la primera matriz de <a>etiquetas, o depende de la condición que realice.

Zange-chan
fuente
2

Este código me funciona para obtener todos los enlaces del documento.

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

La propiedad href establece o devuelve el valor del atributo href de un enlace.

  var hello = domains[i].getElementsByTagName('a')[0].getAttribute('href');
    var url="https://www.google.com/";
    console.log( url+hello);
M.Ganji
fuente
-2
document.getElementById("aaa").href; //for example: http://example.com/sec/IF00.html
ntihin
fuente
2
El OP ya lo intentó y no le da los resultados deseados.
Bobort