Como mudar o href de uma tag a com JavaScript

Neste artigo você vai aprender a como mudar o href de uma tag a com JavaScript, de uma maneira super simples e eficaz!

Fala programador(a), beleza? Bora aprender mais sobre links, href e também sobre a linguagem JavaScript

Primeiramente precisamos ter um elemento de link, uma tag âncora para podermos trabalhar nela

Vamos então criar o nosso HTML de exemplo:

<a href="" id="meu-link">Testando alteração</a>

Veja que o link está em branco, o atributo href, porém o seu pode estar preenchido, da mesma maneira será alterado

Depois de ter o elemento, basta selecioná-lo com algum método de seleção, como o querySelector

E acessar e atribuir um outro valor a propriedade href, isso fará com que o link seja atualizado

Veja um exemplo do que foi explicado acima:

const a = document.querySelector("#meu-link");

a.href = "https://www.google.com.br";

console.log(a);

Veja que alteramos a propriedade href para o link do Google

Isso fará com que ao clicar neste link, o usuário seja redirecionado para lá

Ou seja, mudamos com sucesso a propriedade href com JavaScript!

Conclusão

Neste artigo você aprendeu a como mudar o href de uma tag a, utilizando JavaScript

Utilizamos a seleção do elemento com o querySelector, isso nos dá a possibilidade de acessar todas as suas propriedades

Uma delas é a href, que podemos alterar atribuindo um novo valor a ela, como se fosse uma variável

Desta maneira é possível alterar o link da tag a com JS!

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!

Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias

O link acima contém um cupom de desconto para os cursos!