Como obter Href em JavaScript

Como obter Href em JavaScript

““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:

  • Método getAttribute ()
  • atributo href

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.