HTML yerel depolama, daha iyi cookies .
HTML Yerel Depolama nedir?
Yerel depolama ile, web uygulamaları, kullanıcının tarayıcısında verileri yerel olarak saklayabilir.
HTML5 önce uygulama verileri saklanan gerekiyordu cookies , her sunucu isteğe dahil. Yerel depolama daha güvenli olduğunu ve büyük miktarda veri web sitesi performansını etkilemeden, yerel olarak saklanabilir.
Aksine cookies , depolama sınırı çok daha büyük (at least 5MB) ve bilgi sunucusuna aktarılır asla.
Yerel depolama kökenli başınadır (per domain and protocol) . Tüm sayfalar, bir kökenden, depolamak ve aynı verilere erişebilir.
Tarayıcı Desteği
Tablodaki rakamlar tamamen yerel depolama destekleyen ilk tarayıcı sürümü belirtin.
| API | |||||
|---|---|---|---|---|---|
| Web Storage | 4.0 | 8 | 3.5 | 4.0 | 11.5 |
HTML Yerel Depolama Nesneleri
HTML yerel depolama istemcisi ilgili verilerin saklanmasında iki nesneyi sağlamaktadır:
- window.localStorage - son kullanma tarihi ile verileri saklar
- window.sessionStorage - Bir seans verileri saklar (tarayıcı sekmesi kapatıldığında veriler kaybolur)
Yerel depolama kullanmadan önce, tarayıcı desteğini kontrol localStorage ve sessionStorage :
if(typeof(Storage) !== "undefined") {
// localStorage Nesne localStorage nesne yok son kullanma tarihi ile veri depolar. veri tarayıcı kapatıldığında silinmez ve ertesi gün, hafta veya yıl satışa sunulacak.
Örnek
// Store
localStorage.setItem("lastname", "Smith");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");
Kendin dene " Örnek açıklanmıştır:
- Bir oluşturun localStorage ile ad / değer çifti name="lastname" ve value="Smith"
- Değerini Al "lastname" ve id = "sonuç" ile öğesinin içine yerleştirin
Yukarıdaki örnek de böyle yazılmış olabilir:
// Store
localStorage.lastname = "Smith";
// Retrieve
document.getElementById("result").innerHTML = localStorage.lastname; Kaldırılması için sözdizimi "lastname" şöyle localStorage öğeyi geçerli:
localStorage.removeItem("lastname"); Not: Ad / değer çiftleri hep dizeleri olarak depolanır. gerektiğinde başka bir formata dönüştürmek unutmayın!
Aşağıdaki örnekte bir kullanıcı bir düğmeyi tıkladığı kaç kez sayar. Bu kodda değeri dize sayacını artırmak edebilmek için bir sayıya dönüştürülür:
Örnek
if (localStorage.clickcount) {
localStorage.clickcount = Number(localStorage.clickcount) + 1;
} else {
localStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
localStorage.clickcount + " time(s)."; Kendin dene "
sessionStorage Nesne
sessionStorage nesne eşittir localStorage sadece bir oturum için veri depolayan dışında, nesne. kullanıcı belirli tarayıcı sekmesi kapandığında verileri silinir.
Aşağıdaki örnek geçerli oturumda, bir düğme tıklandığında kullanıcı sayısını sayar:
Örnek
if (sessionStorage.clickcount) {
sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1;
}
else {
sessionStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
sessionStorage.clickcount + " time(s) in this session.";
Kendin dene "