HTML5 - objeto de localização

O objeto localização é um dos muitos que podemos acessar graças a SOL, Isso nos permite obter informações relevantes sobre o endereço do documento e também permite a navegação para outros documentos.
O objeto de localização
Como mencionamos no início, o objeto localização nos permite acessar as propriedades de localização de nosso documento por meio do SOL, para que possamos obter informações detalhadas sobre os endereços e como navegar para outros documentos.
Para obter tudo isso, temos as seguintes propriedades e métodos que podemos usar ao chamar este objeto, vamos ver a lista e o que cada um faz:

· protocolo: Obtém ou define o componente de protocolo da URL do documento.

· hospedar: Obtém ou define o componente de host da URL do documento.

· href : Obtém ou define a localização do documento atual.

· nome de anfitrião: Obtém ou define o nome do host do URL do documento.

· porta: Obtém ou define o componente de porta do URL do documento.

· nome do caminho: Obtém ou define o caminho ou componente do caminho da URL do documento.

· procurar: Obtém ou define o componente de consulta do URL do documento.

· cerquilha : Obtém ou define um componente hash para a URL do documento.

· atribuir (): Navegue até o URL especificado.

· substituir (): Remova o documento atual e navegue até aquele especificado no URL.

· recarregar (): Recarregue ou atualize o documento atual.

· resolveURL (): Resolve o URL relativo especificado para um caminho absoluto.

Muito bom, agora que sabemos o que temos, vamos ver um pequeno exemplo de como obter todas essas informações em um documento usando Javascript em nosso documento HTML.

 Exemplo 

Vamos ver como isso é interpretado no navegador; Para demonstrar a funcionalidade de pesquisa e hash, usamos ? query = apples # apples para que possamos ver como o navegador leva isso, abaixo o resultado na seguinte imagem:

Use o objeto de localização para navegar para outra página
Como já havíamos mencionado anteriormente também podemos usar o objeto de localização para navegar para outro site, ou seja, para ir para outro documento, existem várias formas de fazê-lo, porém veremos uma das mais simples desta vez em um demonstrativo forma, primeiro vamos ver o código que devemos gerar e depois explicaremos como funciona:

 Exemplo
Existem muitos tipos diferentes de frutas - existem mais de 500 variedades de banana. No momento em que adicionamos os incontáveis ​​tipos de maçãs, laranjas e outras frutas conhecidas, nos deparamos com milhares de opções.
Pressione-me
Um dos aspectos mais interessantes da fruta é a variedade disponível em cada país. Eu moro perto de Londres, em uma área conhecida por suas maçãs.
 

Neste código nós simplesmente fazemos o seguinte, primeiro estabelecemos que no elemento com o id pressme vamos incluir uma nova função quando você clicar nele, isso graças ao evento onclick, então dentro da função que é ativada quando você clique nós usamos o objeto document.location.hash e combinamos o valor do hash para o qual vamos navegar, neste caso banana é uma imagem que incluímos como o id de um elemento de imagem img.
Vamos ver como fica em nosso navegador:

PROLONGAR

Como podemos ver, é um comportamento muito útil e conseguimos de uma forma muito simples usando o objeto de localização.
Outra forma poderia ser usar o método replace que listamos anteriormente, porém a particularidade do replace é que ele substitui o documento atual pelo que recebe como parâmetro, eliminando assim do histórico o documento que o chamou, então o botão voltar o navegador não levaria a lugar nenhum.Gostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo