““Href”Significa um link de hipertexto. Durante o desenvolvimento de um site, o URL da página para o qual os pontos de link é especificado usando a âncora HTML “" marcação. Em certos cenários, os desenvolvedores precisam determinar o valor do href, que é o URL da página. Para fazer isso, o JavaScript possui alguns métodos internos que podem ajudá-lo.
Este manual discutirá as maneiras de obter o valor HREF da tag JavaScript Anchor.
Como obter Href em JavaScript?
Para determinar o valor HREF em JavaScript, use os seguintes métodos predefinidos JavaScript:
Vamos examinar essas abordagens individualmente!
Método 1: Obtenha o HREF usando o método getAttribute ()
O "getAttribute ()”O método da interface do elemento fornece o valor de um atributo específico do elemento definido. O valor de retorno é nulo ou a sequência vazia se o atributo desejado estiver faltando.
Sintaxe
Siga a sintaxe dada para obter o href usando o método getAttribute ():
elemento.getAttribute (nome do atributo)
Aqui, "Nome do AtributoӃ o nome do atributo cujo valor queremos obter.
Exemplo: obtenha href usando o método querySelector () com getAttribute ()
Primeiro, criaremos uma tag de âncora, botão e um rótulo para imprimir URL que receberá o valor HREF usando JavaScript “getAttribute ()”Método:
Obtenha o href em javascript
Link
Em seguida, defina o “geturl ()”Função no arquivo JavaScript, onde iremos primeiro, obtenha a tag âncora usando“QuerySelector ()”Método e, em seguida. Ele descobrirá a primeira etiqueta de âncora e recuperará seu URL e o armazenará no “Href" variável. Finalmente, imprime o valor como o texto da etiqueta adicionada:
função geturl ()
var href = documento.QuerySelector ('A').getAttribute ('href');
var url = documento.getElementById ('geturl');
url.TextContent = 'O URL é $ href';
A saída exibe o valor do href em um botão Clique:
Vamos passar para o próximo método para obter href em javascript.
Método 2: Obtenha o HREF usando o atributo href
O outro método para obter o valor do href é o “Href”Atributo. O HREF é de propriedade do “HtmlanchorElement”Isso atualiza o href e fornece uma string com o URL completo.
Sintaxe
Use a seguinte sintaxe para obter o valor do HREF com a ajuda do “Href”Atributo:
âncora.Href
Exemplo: obtenha href usando o método getElementById () com atributo href
Vamos considerar o mesmo link na etiqueta âncora usada no exemplo anterior. Então, no “geturl ()”Função, primeiro acesse a tag de âncora, passando o“link”Id da tag âncora no“getElementById ()”Método e chamar o“Href”Atribua com ele. Em seguida, obtenha novamente a etiqueta adicionada usando o mesmo procedimento e defina o valor do HREF buscado como seu conteúdo:
função geturl ()
const valor1 = documento.getElementById ("link").href;
const url = documento.getElementById ('geturl');
url.textContent = 'O URL é $ value1';
Saída
Fornecemos a solução mais simples para obter o valor HREF em JavaScript.
Conclusão
Para obter o href em JavaScript, você pode utilizar os métodos predefinidos JavaScript, como o método getAttribute () e o atributo href. A única coisa que separa o método getAttribute () do atributo href é que ele retorna o valor do elemento âncora, enquanto o HREF dá todo o caminho ao qual o elemento âncora Points. Neste manual, discutimos as maneiras de obter o valor HREF da tag JavaScript Anchor.