Como resgatar dados do GET com JavaScript

Neste artigo você vai aprender a como resgatar dados do GET com JavaScript, que são os parâmetros de URL, enviados por formulário, por exemplo

Fala programador(a), beleza? Bora aprender mais sobre formulários, parâmetro de GET e também JavaScript!

Para resolver este problema precisamos juntar algumas peças, a primeira é a URL

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

• 120 aulas
• 4 projetos
• 9h 45min

Conhecer formação

Receber a RL atual com JS é fácil, vamos utilizar a propriedade window.location.href

Agora temos a URL em uma string, depois podemos instânciar a classe URL, que nos dá a possibilida de trabalhar com URLs

E por fim vamos utilizar o método get, da classe URL, que é possível resgatar o parâmetro

Veja um exemplo prático da explicação acima:

var urlAtual = window.location.href;

var urlClass = new URL(urlAtual);

var nome = urlClass.searchParams.get("nome");

console.log(nome); // Algum nome que está como parâmetro na URL

Criamos algumas variáveis, uma para receber a URL e depois para instanciar a classe URL

Por fim criamos a variável nome, que é o conteúdo de algum parâmetro chamado nome na URL que estamos acessando

Este deve ser modificado para atender as suas necessidades!

Lembre-se também que se o parâmetro não existir receberemos null como resposta

Então baseado nisso, podemos fazer condicionais com as respostas que são recebidas por meio do método get

Conclusão

Neste artigo você aprendeu a como resgatar dados do GET com JavaScript, que geralmente vem dos formulários

Resgatamos a URL atual com window.location.href e depois instanciamos a classe URL

Da classe utilizamos o método get, com o nome do dado que queremos resgatar

Se houver um parâmetro com este nome, recebemos o valor em string e se não, recebemos o valor de null

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!