API Penyimpanan Web adalah sintaks sederhana untuk menyimpan dan mengambil data di browser. dan sangat mudah untuk digunakan.
Contoh:
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> localStorage.setItem("name","John Doe"); document.getElementById("demo").innerHTML = localStorage.getItem("name"); </script> </body> </html>
API Penyimpanan Web didukung di semua browser:
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Ya | Ya | Ya | Ya | Ya |
Section Artikel
Objek localStorage
Objek localStorage menyediakan akses ke penyimpanan lokal untuk Situs Web tertentu. Hal ini memungkinkan untuk menyimpan, membaca, menambah, memodifikasi, dan menghapus item data untuk domain itu.
Data disimpan tanpa tanggal kadaluwarsa, dan tidak akan dihapus saat browser ditutup.
Data akan tersedia selama berhari-hari, berminggu-minggu, dan bertahun-tahun.
Metode setItem()
Metode localStorage.setItem() menyimpan item data dalam penyimpanan.
Dibutuhkan nama dan nilai sebagai parameter.
Contoh:
localStorage.setItem("name", "John Doe");
Metode getItem()
Metode localStorage.getItem() mengambil item data dari penyimpanan.
Dibutuhkan nama sebagai parameter.
Contoh:
localStorage.getItem("name");
Objek sessionStorage
Objek sessionStorage identik dengan objek localStorage.
Perbedaannya adalah objek sessionStorage menyimpan data untuk satu sesi.
Data tersebut dihapus saat browser ditutup.
Contoh:
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> sessionStorage.setItem("name","John Doe"); document.getElementById("demo").innerHTML = sessionStorage.getItem("name"); </script> </body> </html>
Metode setItem()
Metode sessionStorage.setItem () menyimpan item data dalam penyimpanan.
Dibutuhkan nama dan nilai sebagai parameter.
Contoh
sessionStorage.setItem("name", "John Doe");
Metode getItem()
Metode sessionStorage.getItem() mengambil item data dari penyimpanan.
Dibutuhkan nama sebagai parameter.
Contoh:
sessionStorage.getItem ("name");
Properti dan Metode Objek Penyimpanan
Properti/Method | Deskripsi |
---|---|
key(n) | Menampilkan nama kunci ke-n dalam penyimpanan |
length | Mengembalikan jumlah item data yang disimpan di objek Storage |
getItem(keyname) | Mengembalikan nilai dari nama kunci yang ditentukan |
setItem(keyname, value) | Menambahkan kunci itu ke penyimpanan, atau memperbarui nilai kunci itu jika sudah ada |
removeItem(keyname) | Menghapus kunci itu dari penyimpanan |
clear() | Kosongkan semua kunci dari penyimpanan |
Related Pages for Web Storage API
Properti | Deskripsi |
---|---|
window.localStorage | Memungkinkan untuk menyimpan pasangan kunci / nilai di browser web. Menyimpan data tanpa tanggal kedaluwarsa |
window.sessionStorage | Memungkinkan untuk menyimpan pasangan kunci / nilai di browser web. Menyimpan data untuk satu sesi |