¿Cómo creo un enlace usando JavaScript?

Resuelto Xavier asked hace 13 años • 8 respuestas

Tengo una cadena para un título y una cadena para un enlace. No estoy seguro de cómo juntar los dos para crear un enlace en una página usando JavaScript. Se agradece cualquier ayuda.

La razón por la que estoy tratando de resolver esto es porque tengo una fuente RSS y una lista de títulos y URL. Me gustaría vincular los títulos a la URL para que la página sea útil.

Estoy usando jQuery pero soy completamente nuevo en esto y no sabía que podría ayudar en esta situación.

Xavier avatar Jan 23 '11 14:01 Xavier
Aceptado
<html>
  <head></head>
  <body>
    <script>
      var a = document.createElement('a');
      var linkText = document.createTextNode("my title text");
      a.appendChild(linkText);
      a.title = "my title text";
      a.href = "http://example.com";
      document.body.appendChild(a);
    </script>
  </body>
</html>
Jared Farrish avatar Jan 23 '2011 07:01 Jared Farrish

Con JavaScript

  1. var a = document.createElement('a');
    a.setAttribute('href',desiredLink);
    a.innerHTML = desiredText;
    // apend the anchor to the body
    // of course you can append it almost to any other dom element
    document.getElementsByTagName('body')[0].appendChild(a);
    
  2. document.getElementsByTagName('body')[0].innerHTML += '<a href="'+desiredLink+'">'+desiredText+'</a>';
    

    o, como lo sugiere @travis :

    document.getElementsByTagName('body')[0].innerHTML += desiredText.link(desiredLink);
    
  3. <script type="text/javascript">
    //note that this case can be used only inside the "body" element
    document.write('<a href="'+desiredLink+'">'+desiredText+'</a>');
    </script>
    

Con JQuery

  1. $('<a href="'+desiredLink+'">'+desiredText+'</a>').appendTo($('body'));
    
  2. $('body').append($('<a href="'+desiredLink+'">'+desiredText+'</a>'));
    
  3. var a = $('<a />');
    a.attr('href',desiredLink);
    a.text(desiredText);
    $('body').append(a);
    

En todos los ejemplos anteriores, puede agregar el ancla a cualquier elemento, no solo al 'cuerpo', y desiredLinkes una variable que contiene la dirección a la que apunta su elemento ancla, y desiredTextes una variable que contiene el texto que se mostrará en el elemento de anclaje.

gion_13 avatar Jan 23 '2011 08:01 gion_13

Crear enlaces usando JavaScript:

<script language="javascript">
<!--
document.write("<a href=\"www.example.com\">");
document.write("Your Title");
document.write("</a>");
//-->
</script>

O

<script type="text/javascript">
document.write('Your Title'.link('http://www.example.com'));
</script>

O

<script type="text/javascript">
newlink = document.createElement('a');
newlink.innerHTML = 'Google';
newlink.setAttribute('title', 'Google');
newlink.setAttribute('href', 'http://google.com');
document.body.appendChild(newlink);
</script>
Naveed avatar Jan 23 '2011 07:01 Naveed

Cree dinámicamente un hipervínculo con JavaScript sin formato:

   var anchorElem = document.createElement('a');
   anchorElem.setAttribute("href", yourLink);
   anchorElem.innerHTML = yourLinkText;

   document.body.appendChild(anchorElem); // append your new link to the body
jamesmortensen avatar Jan 23 '2011 07:01 jamesmortensen