Window.sessionStorage
Baseline
Ampliamente disponible
Esta caracterÃstica estÃĄ consolidada y funciona en muchos dispositivos y versiones de navegador. EstÃĄ disponible en todos los navegadores desde julio de 2015.
La propiedad sessionStorage permite acceder a un objeto Storage asociado a la sesiÃģn actual. La propiedad sessionStorage es similar a localStorage, la Única diferencia es que la informaciÃģn almacenada en localStorage no posee tiempo de expiraciÃģn, por el contrario la informaciÃģn almacenada en sessionStorage es eliminada al finalizar la sesion de la pÃĄgina. La sesiÃģn de la pÃĄgina perdura mientras el navegador se encuentra abierto, y se mantiene por sobre las recargas y reaperturas de la pÃĄgina. Abrir una pÃĄgina en una nueva pestaÃąa o ventana iniciarÃĄ una nueva sesiÃģn, lo que difiere en la forma en que trabajan las cookies de sesiÃģn.
Sintaxis
// Almacena la informaciÃģn en sessionStorage
sessionStorage.setItem("key", "value");
// Obtiene la informaciÃģn almacenada desde sessionStorage
var data = sessionStorage.getItem("key");
Valor
Un objeto de tipo Storage.
Ejemplo
El siguiente cÃģdigo accede al objeto Storage del la sesiÃģn actual del domino y le aÃąade un elemento utilizando Storage.setItem().
sessionStorage.setItem("myCat", "Tom");
El siguiente ejemplo graba de forma automÃĄtica el contenido de un campo de texto, y si el navegador es actualizado accidentalmente, restaura el contenido del campo de texto para no perder lo escrito.
// Obtiene el campo de texto que vamos a moniterear
var field = document.getElementById("field");
// Verificamos si tenemos algÚn valor auto guardado
// (esto solo ocurrirÃĄ si la pÃĄgina es recargada accidentalmente)
if (sessionStorage.getItem("autosave")) {
// Restaura el contenido al campo de texto
field.value = sessionStorage.getItem("autosave");
}
// Espera por cambios en el campo de texto
field.addEventListener("change", function () {
// Almacena el resultado en el objeto de almacenamiento de sesiÃģn
sessionStorage.setItem("autosave", field.value);
});
Nota: Por favor dirÃjase al artÃculo Usando la API de Web Storage para un ejemplo completo.
Especificaciones
| EspecificaciÃģn |
|---|
| HTML # dom-sessionstorage-dev |
