Web Storage API


Innehållsförteckning

    Visa innehållsförteckning


Web Storage API är en enkel syntax för att lagra och hämta data i webbläsaren. Det är väldigt lätt att använda:

Exempel

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

Prova själv →

<!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 stöds i alla webbläsare:

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

LocalStorage Object

LocalStorage-objektet ger åtkomst till en lokal lagring för en viss webbplats. Det låter dig lagra, läsa, lägga till, ändra och ta bort dataobjekt för den domänen.

Uppgifterna lagras utan utgångsdatum och kommer inte att raderas när webbläsaren stängs.

Uppgifterna kommer att vara tillgängliga för dagar, veckor och år.


Metoden setItem()

Metoden localStorage.setItem() lagrar ett dataobjekt i ett minne.

Det tar ett namn och ett värde som parametrar:

Exempel

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

Metoden getItem()

Metoden localStorage.getItem() hämtar ett dataobjekt från lagringen.

Det tar ett namn som parameter:

Exempel

localStorage.getItem("name");


SessionStorage Object

SessionStorage-objektet är identiskt med localStorage-objektet.

Skillnaden är att sessionStorage-objektet lagrar data för en session.

Uppgifterna raderas när webbläsaren stängs.

Exempel

sessionStorage.getItem("name");

Prova själv →

<!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() lagrar ett dataobjekt i ett minne.

Det tar ett namn och ett värde som parametrar:

Exempel

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

Metoden getItem()

Metoden sessionStorage.getItem() hämtar ett dataobjekt från lagringen.

Det tar ett namn som parameter:

Exempel

sessionStorage.getItem("name");

Egenskaper och metoder för lagringsobjekt

key(n)

Returnerar namnet på n:te nyckeln i lagringen

length

Returnerar antalet dataobjekt lagrade i Storage-objektet

getItem(keyname)

Returnerar värdet för det angivna nyckelnamnet

setItem(keyname, value)

Lägger till en nyckel till lagringen eller uppdaterar ett nyckelvärde (om det redan finns)

removeItem(keyname)

Tar bort den nyckeln från lagringen

clear()

Töm alla nycklar ur förvaringen

Relaterade sidor för Web Storage API

window.localStorage

Tillåter att spara nyckel/värdepar i en webbläsare. Lagrar data med nr utgångsdatum

window.sessionStorage

Tillåter att spara nyckel/värdepar i en webbläsare. Lagrar data för en session