Cavando a API de história do HTML5

Este artigo apresenta principalmente a exploração aprofundada da API HTML5 History e concentra-se no novo Methods History.pushstate () e History.Replacestate () em html5. Amigos que precisam podem se referir a ele.

A história é divertida, não é? Nas versões anteriores do HTML, tínhamos operações muito limitadas no histórico de navegação. Podemos usar os métodos que podemos usar para frente e para trás, mas isso é tudo o que podemos fazer.

No entanto, usando a API HTML 5 History, podemos controlar melhor a história do navegador. Por exemplo: podemos adicionar um registro à lista de histórico ou atualizar o URL da barra de endereços quando não estiver atualizado.

Por que apresentar a API da história?

Neste artigo, aprenderemos sobre a origem da API de história no HTML 5. Antes disso, costumamos usar valores de hash para alterar o conteúdo da página, especialmente aqueles que são particularmente importantes para a página. Como não é atualizado, é impossível alterar seu URL para um aplicativo de uma única página. Além disso, quando você muda o valor de hash do URL, isso não afeta a história do navegador.

Então, agora para a API HTML 5 History, eles são fáceis de implementar, mas como os aplicativos de uma página única não precisam usar valores de hash, isso pode exigir scripts de desenvolvimento adicionais. Também nos permite criar novos aplicativos de uma maneira amigável de SEO. Além disso, pode reduzir a largura de banda, mas como pode ser comprovada?

No artigo, usarei a API do histórico para desenvolver um aplicativo de uma única página para provar o problema acima.

Isso também significa que eu tenho que carregar os recursos necessários primeiro na página inicial. Agora comece, a página carrega apenas o conteúdo de que você precisa. Em outras palavras, o aplicativo não carrega todo o conteúdo no início e só será carregado ao solicitar o segundo conteúdo do aplicativo.

Observe que você precisa executar alguma codificação do lado do servidor para fornecer apenas parte dos recursos, não o conteúdo completo da página.

Ao escrever este artigo, o suporte à API do histórico dos principais navegadores é muito bom. Você pode clicar aqui para ver o apoio deles. Este link informará os navegadores suportados e, antes de usá -los, sempre existem boas práticas para detectar funções suportadas específicas.

Para determinar se o navegador suporta essa API de certa forma, você pode usar a seguinte linha de código para verificar: