Como ler parâmetros da URL com JavaScript (query string)

Neste artigo você vai aprender a ler parâmetros da URL com JavaScript, o valor ou parâmetro da URL é chamado de query string

Conteúdo também disponível em vídeo:

Fala programador(a), beleza? Bora aprender a como ler os parâmetros de uma URL utilizando JavaScript!

Formação Recomendada

Formação Claude Code

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

• 116 aulas
• 4 projetos
• 9h 23min

Conhecer formação

Antigamente era bem mais difícil ler os parâmetros da URL do que hoje em dia, temos métodos prontos para isso

Vamos instanciar um objeto chamado URLSearchParams, passando todos os parâmetos da URL atual

Os parâmetros podem ser resgatados com window.location.search, que vai passar tudo após a interrogação, que é onde inicia a query string

Depois podemos com o método get deste objeto, resgatar qualquer parâmetro da URL

Veja o exemplo prático:

const urlParams = new URLSearchParams(window.location.search);

const myParam = urlParams.get('myParam');

console.log(myParam)

Neste caso instanciamos o objeto na variável urlParams, depois colocamos para variável myParam o nosso parâmetro

Veja que no método get passamos um parâmetro, o que é o nome da chave do parâmetro na URL

No console.log o valor do parâmetor desejado é exibido

E pronto, resolvemos o nosso problema! 😀

Conclusão

Neste artigo você aprendeu a ler parâmetros da URL com JavaScript

Utilizamos uma classe chamada URLSearchParams, que nos dá acesso aos parâmetros pelo seu método get

Desta maneira podemos ler qualquer um dos valores da URL passados após a interrogação, que é onde o começo da query string é determinado

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube