Stocare Web în HTML5. Obiectul localStorage.

Obiectul localStorage

Obiectul localStorage stochează datele fără data de expirare. Datele nu vor fi șterse atunci când browserul este închis și vor fi disponibile a doua zi, săptămână sau an.

Exemplu:

// Magazin
localStorage.setItem("lastname", "Popescu");

// Recuperare
document.getElementById("result").innerHTML = localStorage.getItem("lastname");

Exemplu explicat:

Creați o pereche localStorage nume / valoare cu name = "lastname" și value = "Popescu"
Obțineți valoarea „lastname” și introduceți-o în elementul cu id = „result”

Exemplul de mai sus poate fi scris astfel:

// Magazin
localStorage.lastname = "Popescu";
// Recuperare
document.getElementById("result").innerHTML = localStorage.lastname;

Sintaxa pentru înlăturarea elementului localStorage „lastname” este următoarea:

localStorage.removeItem("lastname");

Notă: Perechile nume / valoare sunt întotdeauna stocate ca șiruri. Nu uitați să le convertiți în alt format atunci când este nevoie!

Următorul exemplu contează de câte ori un utilizator a făcut click pe un buton. În acest cod, șirul de valori este convertit într-un număr pentru a putea crește contorul:

Exemplu:

if (localStorage.clickcount) {
  localStorage.clickcount = Number(localStorage.clickcount) + 1;
} else {
  localStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "Ați făcut click pe butonul" +
localStorage.clickcount + " timp(s).";