Web Storage API

Obsah

    Zobrazit obsah

Web Storage API je jednoduchá syntaxe pro ukládání a načítání dat v prohlížeči. Použití je velmi snadné:

Příklad

localStorage.setItem("name", "John Doe");
localStorage.getItem("name");

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
localStorage.setItem("name","John Doe");
document.getElementById("demo").innerHTML = localStorage.getItem("name");
</script>

</body>
</html>

Web Storage API je podporováno ve všech prohlížečích:

Chrome IE/Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

Objekt localStorage

Objekt localStorage poskytuje přístup k místnímu úložišti pro konkrétní web. Umožňuje vám ukládat, číst, přidávat, upravovat a odstraňovat datové položky pro danou doménu.

Data jsou uložena bez data vypršení platnosti a po zavření prohlížeče nebudou smazána.

Data budou k dispozici za dny, týdny a roky.

Metoda setItem().

Metoda localStorage.setItem() ukládá datovou položku do úložiště.

Jako parametry bere název a hodnotu:

Příklad

localStorage.setItem("name", "John Doe");

Metoda getItem().

Metoda localStorage.getItem() načte datovou položku z úložiště.

Jako parametr bere jméno:

Příklad

localStorage.getItem("name");

Objekt sessionStorage

Objekt sessionStorage je identický s objektem localStorage.

Rozdíl je v tom, že objekt sessionStorage ukládá data pro jednu relaci.

Data se vymažou při zavření prohlížeče.

Příklad

sessionStorage.getItem("name");

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
sessionStorage.setItem("name","John Doe");
document.getElementById("demo").innerHTML = sessionStorage.getItem("name");
</script>

</body>
</html>

Metoda setItem().

Metoda sessionStorage.setItem() ukládá datovou položku do úložiště.

Jako parametry bere název a hodnotu:

Příklad

sessionStorage.setItem("name", "John Doe");

Metoda getItem().

Metoda sessionStorage.getItem() načte datovou položku z úložiště.

Jako parametr bere jméno:

Příklad

sessionStorage.getItem("name");

Vlastnosti a metody úložiště

key(n)

Vrátí název n-tého klíče v úložišti

length

Vrátí počet datových položek uložených v objektu Storage

getItem(keyname)

Vrátí hodnotu zadaného názvu klíče

setItem(keyname, value)

Přidá klíč do úložiště nebo aktualizuje hodnotu klíče (pokud již existuje)

removeItem(keyname)

Odebere tento klíč z úložiště

clear()

Vyprázdněte všechny klíče z úložiště

Související stránky pro rozhraní Web Storage API

window.localStorage

Umožňuje uložit páry klíč/hodnota ve webovém prohlížeči. Ukládá data s č Datum spotřeby

window.sessionStorage

Umožňuje uložit páry klíč/hodnota ve webovém prohlížeči. Ukládá data pro jednoho zasedání