Web Storage API

Indholdsfortegnelse

    Vis indholdsfortegnelse

Web Storage API er en simpel syntaks til lagring og hentning af data i browseren. Det er meget nemt at bruge:

Eksempel

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

Prøv det selv →

<!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 understøttes i alle browsere:

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

LocalStorage Object

LocalStorage-objektet giver adgang til et lokalt lager for et bestemt websted. Det giver dig mulighed for at gemme, læse, tilføje, ændre og slette dataelementer for det pågældende domæne.

Dataene gemmes uden udløbsdato, og vil ikke blive slettet, når browseren lukkes.

Dataene vil være tilgængelige for dage, uger og år.

Metoden setItem()

LocalStorage.setItem()-metoden gemmer et dataelement i et lager.

Det tager et navn og en værdi som parametre:

Eksempel

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

GetItem()-metoden

LocalStorage.getItem()-metoden henter et dataelement fra lageret.

Det tager et navn som parameter:

Eksempel

localStorage.getItem("name");

SessionStorage-objektet

SessionStorage-objektet er identisk med localStorage-objektet.

Forskellen er, at sessionStorage-objektet gemmer data for én session.

Dataene slettes, når browseren lukkes.

Eksempel

sessionStorage.getItem("name");

Prøv det selv →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Metoden setItem()

Metoden sessionStorage.setItem() gemmer et dataelement i et lager.

Det tager et navn og en værdi som parametre:

Eksempel

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

GetItem()-metoden

Metoden sessionStorage.getItem() henter et dataelement fra lageret.

Det tager et navn som parameter:

Eksempel

sessionStorage.getItem("name");

Lagerobjektegenskaber og -metoder

key(n)

Returnerer navnet på den nte nøgle i lageret

length

Returnerer antallet af dataelementer, der er gemt i Storage-objektet

getItem(keyname)

Returnerer værdien af det angivne nøglenavn

setItem(keyname, value)

Tilføjer en nøgle til lageret eller opdaterer en nøgleværdi (hvis den allerede findes)

removeItem(keyname)

Fjerner nøglen fra lageret

clear()

Tøm alle nøgler ud af lageret

Relaterede sider til Web Storage API

window.localStorage

Giver mulighed for at gemme nøgle/værdi-par i en webbrowser. Gemmer dataene med nr udløbsdato

window.sessionStorage

Giver mulighed for at gemme nøgle/værdi-par i en webbrowser. Gemmer dataene for en session