Harjutus 4: localStorage

Praktiline ülesanne

Avage veebibrauser, näiteks Firefox või Chrome.Avage veebibrauser, näiteks Firefox või Chrome. Lihtsustamiseks ja vigade vältimiseks võite avada veebisaidi example.com või kirjuta consol’i chrome://newtab

Järgmisena tuleb vajutada klahvi F12 või hiire paremat nuppu ja valida Inspekteeri. Seejärel minna Console’i.

Andmete lisamiseks tuleb kirjutada Console’i:

Sisestage Console’isse localStorage. Näete, et see on tühi.

Andmete lisamiseks tuleb kirjutada Console’i:

localStorage.setItem('car', 'BMW');
console.log(localStorage.getItem('BMW')); 

Ekraanil on näha:

Salvestan localStorage’isse paar võti-väärtust võtme ‚nimi‘ ja väärtusega ‚BMW‘. Saan väärtuse võtme ‚nimi‘ järgi.

Erinevalt sessionStorage’ist salvestatakse andmed localStorage’is brauseri sessioonide vahel – isegi kui brauser sulgeda ja uuesti avada, jäävad andmed alles, kuni need käsitsi või skripti abil kustutad.

Et veenduda, et andmed on salvestatud localStorage’isse, tuleb minna jaotisesse Storage -> Local Storage. Seal on näha, et localStorage’i abil lisatud andmed on salvestatud sellesse kohta.

Kokkuvõtte

LocalStorage hoiab andmed pikkemaks ajaks kuni kasutaja ise kustuta neid. SessionStorage on seotud konkretse brauseri sessioniga.