--- title: Storage slug: Web/API/Storage tags: - API - Dati - Interfaccia - Riferimento - Storage - Web Storage translation_of: Web/API/Storage ---

{{APIRef("Web Storage API")}}

L'interfaccia Storage dell'API Web Storage fornisce accesso allo storage di sessione o allo storage locale per un dato dominio, permettendo, ad esempio, l'aggiunta, modifica o rimozione di dati salvati.

Se si vuole manipolare lo storage di sessione per un dominio, va invocato il metodo {{domxref("Window.sessionStorage")}}; se si vuole manipolare lo storage locale per un dominio, va invocato {{domxref("Window.localStorage")}}.

Proprietà

{{domxref("Storage.length")}} {{readonlyInline}}
Ritorna un intero che rappresenta il numero di oggetti presenti in un oggetto Storage.

Metodi

{{domxref("Storage.key()")}}
Dato un numero n,  ritorna il nome dell'n-esima chiave nello storage.
{{domxref("Storage.getItem()")}}
Dato un nome di chiave, ritorna il corrispondente valore.
{{domxref("Storage.setItem()")}}
Dati un nome di chiave e un valore, aggiunge questa chiave allo storage, o aggiorna il valore della chiave se essa esiste già.
{{domxref("Storage.removeItem()")}}
Dato un nome di chiave, rimuove quella chiave dallo storage.
{{domxref("Storage.clear()")}}
Rimuove tutte le chiavi dallo storage.

Esempi

Questo è un esempio di accesso all'oggetto Storage tramite chiamata a localStorage. In primo luogo, si verifica se lo storage locale contenga oggetti usando !localStorage.getItem('bgcolor'). Se il test passa, si invoca una funzione setStyles() che recupera gli oggetti tramite {{domxref("localStorage.getItem()")}} e ne usa i valori per aggiornare gli stili della pagina. Se il test fallisce, viene invocata un'altra funzione, populateStorage(), che usa {{domxref("localStorage.setItem()")}} per settare i valori, per poi ritornare setStyles().

if(!localStorage.getItem('bgcolor')) {
  populateStorage();
} else {
  setStyles();
}

function populateStorage() {
  localStorage.setItem('bgcolor', document.getElementById('bgcolor').value);
  localStorage.setItem('font', document.getElementById('font').value);
  localStorage.setItem('image', document.getElementById('image').value);

  setStyles();
}

function setStyles() {
  var currentColor = localStorage.getItem('bgcolor');
  var currentFont = localStorage.getItem('font');
  var currentImage = localStorage.getItem('image');

  document.getElementById('bgcolor').value = currentColor;
  document.getElementById('font').value = currentFont;
  document.getElementById('image').value = currentImage;

  htmlElem.style.backgroundColor = '#' + currentColor;
  pElem.style.fontFamily = currentFont;
  imgElem.setAttribute('src', currentImage);
}

Nota: Per vedere quest'esempio girare, si veda la Web Storage Demo.

Specifiche

Specifica Status Commento
{{SpecName('Web Storage', '#the-storage-interface', 'Storage')}} {{Spec2('Web Storage')}}  

Compatibilità dei browser

{{CompatibilityTable}}

Funzionalità Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
localStorage 4 3.5 8 10.50 4
sessionStorage 5 2 8 10.50 4
Funzionalità Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Supporto minimo 2.1 {{ CompatUnknown }} 8 11 3.2[1]

[1] A partite da iOS 5.1, Safari Mobile salva i dati del localStorage in una cartella di cache, soggetta occasionalmente a pulizia su richiesta del sistema operativo, tipicamente in mancanza di spazio.

I vari browser hanno diversi livelli di capacità sia per localStorage che per sessionStorage. Qui si trova un resoconto dettagliato delle capacità di immagazzinamento dei vari browser.

Vedere anche

Usare la API Web Storage