API de almacenamiento web
La API de almacenamiento web es una sintaxis simple para almacenar y recuperar datos en el navegador. Es muy fácil de usar:
Ejemplo
localStorage.setItem("name", "John Doe");
localStorage.getItem("name");
La API de almacenamiento web es compatible con todos los navegadores:
| Chrome | IE/Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
El objeto de almacenamiento local
El objeto localStorage proporciona acceso a un almacenamiento local para un sitio web en particular. Le permite almacenar, leer, agregar, modificar y eliminar elementos de datos para ese dominio.
Los datos se almacenan sin fecha de vencimiento y no se eliminarán cuando se cierre el navegador.
Los datos estarán disponibles por días, semanas y años.
El método setItem()
El método localStorage.setItem() almacena un elemento de datos en un almacenamiento.
Toma un nombre y un valor como parámetros:
Ejemplo
localStorage.setItem("name", "John Doe");
El método getItem()
El método localStorage.getItem() recupera un elemento de datos del almacenamiento.
Toma un nombre como parámetro:
Ejemplo
localStorage.getItem("name");
El objeto sessionStorage
El objeto sessionStorage es idéntico al objeto localStorage.
La diferencia es que el objeto sessionStorage almacena datos para una sesión.
Los datos se eliminan cuando se cierra el navegador.
Ejemplo
sessionStorage.getItem("name");
El método setItem()
El método sessionStorage.setItem() almacena un elemento de datos en un almacenamiento.
Toma un nombre y un valor como parámetros:
Ejemplo
sessionStorage.setItem("name", "John Doe");
El método getItem()
El método sessionStorage.getItem() recupera un elemento de datos del almacenamiento.
Toma un nombre como parámetro:
Ejemplo
sessionStorage.getItem("name");
Propiedades y métodos de objetos de almacenamiento
| 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 con la API de almacenamiento 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 |