Web Storage API

Πίνακας περιεχομένων

    Εμφάνιση πίνακα περιεχομένων

Το Web Storage API είναι μια απλή σύνταξη για την αποθήκευση και την ανάκτηση δεδομένων στο πρόγραμμα περιήγησης. Είναι πολύ εύκολο στη χρήση:

Παράδειγμα

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

Δοκιμάστε το μόνοι σας →

<!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 υποστηρίζεται σε όλα τα προγράμματα περιήγησης:

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

Το αντικείμενο τοπικής αποθήκευσης

Το αντικείμενο localStorage παρέχει πρόσβαση σε έναν τοπικό χώρο αποθήκευσης για μια συγκεκριμένη τοποθεσία Web. Σας επιτρέπει να αποθηκεύετε, να διαβάζετε, να προσθέτετε, να τροποποιείτε και να διαγράφετε στοιχεία δεδομένων για αυτόν τον τομέα.

Τα δεδομένα αποθηκεύονται χωρίς ημερομηνία λήξης και δεν θα διαγραφούν όταν κλείσει το πρόγραμμα περιήγησης.

Τα δεδομένα θα είναι διαθέσιμα για ημέρες, εβδομάδες και χρόνια.

Η μέθοδος setItem().

Η μέθοδος localStorage.setItem() αποθηκεύει ένα στοιχείο δεδομένων σε έναν χώρο αποθήκευσης.

Παίρνει ένα όνομα και μια τιμή ως παραμέτρους:

Παράδειγμα

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

Η μέθοδος getItem().

Η μέθοδος localStorage.getItem() ανακτά ένα στοιχείο δεδομένων από την αποθήκευση.

Παίρνει ένα όνομα ως παράμετρο:

Παράδειγμα

localStorage.getItem("name");

Το αντικείμενο αποθήκευσης session

Το αντικείμενο sessionStorage είναι πανομοιότυπο με το αντικείμενο localStorage.

Η διαφορά είναι ότι το αντικείμενο sessionStorage αποθηκεύει δεδομένα για μία περίοδο λειτουργίας.

Τα δεδομένα διαγράφονται όταν το πρόγραμμα περιήγησης είναι κλειστό.

Παράδειγμα

sessionStorage.getItem("name");

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Η μέθοδος setItem().

Η μέθοδος sessionStorage.setItem() αποθηκεύει ένα στοιχείο δεδομένων σε έναν χώρο αποθήκευσης.

Παίρνει ένα όνομα και μια τιμή ως παραμέτρους:

Παράδειγμα

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

Η μέθοδος getItem().

Η μέθοδος sessionStorage.getItem() ανακτά ένα στοιχείο δεδομένων από την αποθήκευση.

Παίρνει ένα όνομα ως παράμετρο:

Παράδειγμα

sessionStorage.getItem("name");

Ιδιότητες και μέθοδοι αντικειμένου αποθήκευσης

key(n)

Επιστρέφει το όνομα του nου κλειδιού στον χώρο αποθήκευσης

length

Επιστρέφει τον αριθμό των στοιχείων δεδομένων που είναι αποθηκευμένα στο αντικείμενο αποθήκευσης

getItem(keyname)

Επιστρέφει την τιμή του καθορισμένου ονόματος κλειδιού

setItem(keyname, value)

Προσθέτει ένα κλειδί στο χώρο αποθήκευσης ή ενημερώνει μια τιμή κλειδιού (αν υπάρχει ήδη)

removeItem(keyname)

Αφαιρεί αυτό το κλειδί από την αποθήκευση

clear()

Αδειάστε όλο το κλειδί από τον αποθηκευτικό χώρο

Σχετικές σελίδες για το API αποθήκευσης Ιστού

window.localStorage

Επιτρέπει την αποθήκευση ζευγών κλειδιών/τιμών σε ένα πρόγραμμα περιήγησης ιστού. Αποθηκεύει τα δεδομένα με αρ ημερομηνία λήξης

window.sessionStorage

Επιτρέπει την αποθήκευση ζευγών κλειδιών/τιμών σε ένα πρόγραμμα περιήγησης ιστού. Αποθηκεύει τα δεδομένα για ένα συνεδρία