Almacenamiento del lado del cliente (cliente-side) en HTML5
HTML 5 ofrece dos nuevos métodos para almacenar datos del lado del cliente:
- localStorage: almacena datos en pares (clave,valor) y sin límite de tiempo; éstos están disponibles en su totalidad para el dominio que los solicitó.
- sessionStorage: almacena datos en pares (clave,valor) y limitados en tiempo a la duración de la sesión; éstos están disponibles para todo el dominio.
Métodos de almacenamiento en HTML5
- setItem(clave,valor): agrega una par (clave,valor) a objeto sessionStorage.
- getItem(clave): devuelve el valor de clave pasada.
- key(n): devuelva el valor para clave pasada (n).
- clear(): remueve todos los pares (clave,valor) del objeto sessionStorage.
- removeItem(clave): remueve un par (clave,valor) del objeto sessionStorage.
Ejemplos para los objetos sessionStorage y localStorage
Guardar con el objeto localStorage:
localStorage.setItem('mostrar_barra', 'si');
Crear y acceder a un objeto sessionStorage:
<script type="text/javascript"> sessionStorage.lastname="Diego"; document.write(sessionStorage.lastname); </script>
Contar el número de visitas a la página en la sesión actual:
<script type="text/javascript">if (sessionStorage.pagecount) { sessionStorage.pagecount=Number(sessionStorage.pagecount) +1; } else { sessionStorage.pagecount=1; } document.write("Pá,ginas visitadas "+sessionStorage.pagecount+" durante esta sesión.");</script>