Adalah mungkin untuk secara permanen mengubah variabel javascript? Seperti, jika saya set variabel X dan membuat yang sama dengan 1. Kemudian onClick dari tombol change sehingga variabel ke-2. Bagaimana saya bisa mendapatkan bahwa variabel untuk menginap di 2 di refresh halaman?
Hal ini dimungkinkan dengan jendela.localStorage
atau window.sessionStorage
. Perbedaannya adalah bahwa sessionStorage
berlangsung selama browser tetap terbuka, localStorage
bertahan lalu restart browser. Kegigihan berlaku untuk seluruh situs web bukan hanya satu halaman itu.
Ketika anda perlu untuk menetapkan variabel yang harus tercermin dalam halaman berikutnya(s), menggunakan:
var someVarName = "value";
localStorage.setItem("someVarKey", someVarName);
Dan di setiap halaman (seperti ketika halaman telah dimuat), seperti:
var someVarName = localStorage.getItem("someVarKey");
.getItem()
akan kembali kosong
jika tidak ada nilai yang disimpan, atau nilai yang disimpan.
Perhatikan bahwa hanya nilai-nilai string dapat disimpan dalam penyimpanan ini, tetapi hal ini dapat diatasi dengan menggunakan JSON.stringify
dan JSON.mengurai
. Secara teknis, setiap kali anda menelepon .setItem()
, ia akan memanggil .toString()
pada nilai dan toko itu.
MDN's DOM storage guide (terkait di bawah ini), memiliki workarounds/polyfills, yang akhirnya jatuh kembali ke hal-hal seperti cookies, jika localStorage
isn't yang tersedia.
Itu tidak't menjadi ide yang buruk untuk menggunakan yang sudah ada, atau membuat anda sendiri perpustakaan mini, yang abstrak kemampuan untuk menyimpan semua jenis data (seperti objek literal, array, dll.).
Referensi:
Khusus
- https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/StoragelocalStorage
- https://developer.mozilla.org/en-US/docs/DOM/Storage#localStorageJSON
- https://developer.mozilla.org/en-US/docs/JSONSelain kue dan localStorage
, ada's setidaknya satu tempat anda dapat menyimpan "semi-persistent" data klien: jendela.nama
. Setiap string nilai yang anda tetapkan untuk jendela.nama
akan tinggal di sana sampai jendela ditutup.
Untuk menguji itu, hanya buka console dan ketik jendela.nama = "anu"
, kemudian refresh halaman dan jenis jendela.nama
; itu harus menanggapi dengan foo
.
Ini adalah sedikit hack, tapi jika anda don't ingin cookies diisi dengan data yang tidak perlu dikirim ke server dengan setiap permintaan, dan jika anda dapat't menggunakan localStorage
untuk alasan apapun (klien warisan), hal ini dapat menjadi pilihan untuk dipertimbangkan.
jendela.nama
memiliki properti lain yang menarik: it's terlihat untuk windows disajikan dari domain lain; it's tidak tunduk sama-asal kebijakan seperti hampir setiap properti lainnya dari jendela
. Jadi, selain untuk menyimpan "semi-persistent" data-data yang ada sementara pengguna menavigasi atau refresh halaman tersebut, anda juga dapat menggunakannya untuk CORS-cross-domain komunikasi.
Perhatikan bahwa jendela.nama
hanya dapat menyimpan string, tapi dengan ketersediaan luas JSON
, ini seharusnya't akan banyak masalah bahkan untuk data yang kompleks.
Anda akan memiliki untuk menggunakan cookie untuk menyimpan nilai di refresh halaman. Anda dapat menggunakan salah satu dari banyak berbasis javascript cookie perpustakaan untuk menyederhanakan cookie akses, seperti ini
Jika anda ingin hanya mendukung html5 maka anda bisa memikirkan Penyimpanan api seperti localStorage/sessionStorage
Ex: menggunakan localStorage dan cookies perpustakaan
var mode = getStoredValue('myPageMode');
function buttonClick(mode) {
mode = mode;
storeValue('myPageMode', mode);
}
function storeValue(key, value) {
if (localStorage) {
localStorage.setItem(key, value);
} else {
$.cookies.set(key, value);
}
}
function getStoredValue(key) {
if (localStorage) {
return localStorage.getItem(key);
} else {
return $.cookies.get(key);
}
}