O LocalStorage é uma API do JavaScript que permite guardar dados no navegador sob a forma de pares chave-valor.

Esses dados:

• Permanecem guardados mesmo após fechar o navegador

• Não precisam de base de dados

• São simples de utilizar

Guardar dados no LocalStorage

Para guardar informação:

Para ler informação:

Para remover:

Guardar a pontuação final do jogo

No momento em que o jogo termina:

Mostrar a melhor pontuação

Podemos comparar pontuações e guardar apenas a melhor.

Mostrar no ecrã:

HTML:

Guardar nome do jogador

HTML:

jQuery:

Mostrar automaticamente ao carregar a página:

Limpar dados guardados

Adicionar botão:

jQuery:

Guardar tempo restante

Podemos guardar também o tempo final:

Isto permite criar versões futuras com ranking ou histórico.

Exemplo Integrado

Agora o jogo já tem memória.

Exercício 1 — Melhor Pontuação

Implementa:

• Sistema de melhor pontuação

• Mostrar automaticamente ao iniciar o jogo

Exercício 2 — Histórico Simples

Guarda:

• Nome do jogador

• Pontuação

• Tempo final

Mostra esses dados no ecrã após terminar o jogo.