API de armazenamento da Web
A API de armazenamento da Web é uma sintaxe simples para armazenar e recuperar dados no navegador. É muito fácil de usar:
Exemplo
localStorage.setItem("name", "John Doe");
localStorage.getItem("name");
A API Web Storage é compatível com todos os navegadores:
Chrome | IE/Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes |
O objeto localStorage
O objeto localStorage fornece acesso a um armazenamento local para um determinado site. Ele permite que você armazene, leia, adicione, modifique e exclua itens de dados para esse domínio.
Os dados são armazenados sem data de validade e não serão excluídos quando o navegador for fechado.
Os dados estarão disponíveis por dias, semanas e anos.
O método setItem()
O método localStorage.setItem() armazena um item de dados em um armazenamento.
Ele recebe um nome e um valor como parâmetros:
Exemplo
localStorage.setItem("name", "John Doe");
O método getItem()
O método localStorage.getItem() recupera um item de dados do armazenamento.
Recebe um nome como parâmetro:
Exemplo
localStorage.getItem("name");
O objeto sessionStorage
O objeto sessionStorage é idêntico ao objeto localStorage.
A diferença é que o objeto sessionStorage armazena dados de uma sessão.
Os dados são excluídos quando o navegador é fechado.
Exemplo
sessionStorage.getItem("name");
O método setItem()
O método sessionStorage.setItem() armazena um item de dados em um armazenamento.
Ele recebe um nome e um valor como parâmetros:
Exemplo
sessionStorage.setItem("name", "John Doe");
O método getItem()
O método sessionStorage.getItem() recupera um item de dados do armazenamento.
Recebe um nome como parâmetro:
Exemplo
sessionStorage.getItem("name");
Propriedades e métodos do objeto de armazenamento
Property/Method | Description |
---|---|
key(n) | Returns the name of the nth key in the storage |
length | Returns the number of data items stored in the Storage object |
getItem(keyname) | Returns the value of the specified key name |
setItem(keyname, value) | Adds that key to the storage, or update that key's value if it already exists |
removeItem(keyname) | Removes that key from the storage |
clear() | Empty all key out of the storage |
Páginas relacionadas para a API de armazenamento na Web
Property | Description |
---|---|
window.localStorage | Allows to save key/value pairs in a web browser. Stores the data with no expiration date |
window.sessionStorage | Allows to save key/value pairs in a web browser. Stores the data for one session |