Para desenvolvedores que trabalham com JavaScript, é importante saber como pegar a URL atual de uma página da web.
Isso pode ser útil para várias situações, como para enviar informações para um servidor ou para manipular a URL.
Felizmente, existem várias maneiras de pegar a URL atual com JavaScript.

Uma das maneiras mais simples de pegar a URL atual é usando o objeto “window.location.href”.
Este objeto contém informações sobre a URL atual da página, incluindo o protocolo, o nome do host, a porta, o caminho e a âncora.
Ao usar esse objeto, você pode facilmente pegar a URL atual e usá-la para suas necessidades de programação.
- O objeto “window.location.href” é uma maneira simples de pegar a URL atual de uma página da web com JavaScript.
- Existem outras maneiras de pegar a URL atual, como o objeto “document.URL”.
- Uma vez que você tenha a URL atual, você pode manipulá-la para atender às suas necessidades de programação.
Pegar a URL Atual com JavaScript

Se você está trabalhando com JavaScript, pode ser necessário pegar a URL atual da página. Felizmente, existem algumas maneiras simples de fazer isso.
Você vai gostar também:
Se você tem interesse em artigos relacionado a categoria Javascript clique aqui!
Usando window.location.href
Uma maneira de pegar a URL atual é usando a propriedade window.location.href
. Essa propriedade retorna a URL completa da página atual.
const urlAtual = window.location.href;
console.log(urlAtual);
Usando document.URL
Outra maneira de pegar a URL atual é usando a propriedade document.URL
. Essa propriedade também retorna a URL completa da página atual.
const urlAtual = document.URL;
console.log(urlAtual);
Ambas as maneiras são simples e eficazes de pegar a URL atual da página usando JavaScript. Escolha a que melhor se adapta às suas necessidades e comece a usá-la em seu código.
Manipulando a URL

Ao trabalhar com JavaScript, é comum precisarmos manipular a URL da página atual.
Felizmente, a linguagem oferece diversas maneiras de extrair partes da URL e até mesmo alterá-la sem precisar recarregar a página.
Extraindo Partes da URL
Para extrair partes específicas da URL, podemos utilizar o objeto window.location
. Esse objeto contém diversas propriedades que representam diferentes partes da URL, como href
, protocol
, host
, pathname
, search
e hash
.
Por exemplo, para obter o caminho da URL atual, podemos acessar a propriedade pathname
:
const path = window.location.pathname;
Já para obter os parâmetros da URL, podemos acessar a propriedade search
. Essa propriedade retorna uma string contendo todos os parâmetros da URL, incluindo o ponto de interrogação:
const params = window.location.search;
Podemos então utilizar outras funções de JavaScript para manipular essa string e extrair os parâmetros individuais.
Alterando a URL sem Recarregar

Às vezes, precisamos alterar a URL da página sem precisar recarregá-la completamente. Isso pode ser útil em situações como navegação por abas ou páginas dinâmicas.
Para fazer isso, podemos utilizar o método pushState
do objeto history
. Esse método nos permite adicionar uma nova entrada ao histórico do navegador sem recarregar a página.
const newUrl = 'https://www.example.com/new-page';
window.history.pushState({}, '', newUrl);
Esse código adiciona uma nova entrada ao histórico do navegador com a URL https://www.example.com/new-page
, mas sem recarregar a página atual.
Podemos então utilizar outras funções de JavaScript para atualizar o conteúdo da página de acordo com a nova URL.
Lembre-se de que, ao utilizar o método pushState
, é importante garantir que a nova URL seja uma URL válida.
Caso contrário, o histórico do navegador pode ficar inconsistente e a navegação do usuário pode ser prejudicada.