Bagaimana untuk Mengekalkan Pembolehubah JavaScript Hidup Selepas Muat Semula Halaman?

Bagaimanakah Pembolehubah JavaScript Berkekalan Selepas Muat Semula Halaman?

Keupayaan untuk mengekalkan nilai pembolehubah JavaScript walaupun selepas memuat semula halaman adalah perkara biasa keperluan dalam pembangunan web. Mari kita terokai cara untuk mencapai ini dengan bantuan mekanisme storan penyemak imbas.

Memahami Storan Penyemak Imbas

Terdapat dua mekanisme storan penyemak imbas utama yang boleh digunakan:

• window.localStorage: Storan berterusan yang bertahan dalam penyemak imbas dimulakan semula dan digunakan pada keseluruhan tapak web.
• window.sessionStorage: Storan sementara yang bertahan selagi sesi penyemak imbas masih dibuka.

Menyimpan dan Mendapatkan Pembolehubah

Untuk menetapkan pembolehubah dalam storan setempat, gunakan:

localStorage.setItem("variableName", value);

Untuk mendapatkan semula nilai pembolehubah selepas muat semula halaman:

var retrievedValue = localStorage.getItem("variableName");

sessionStorage mengikut corak yang sama, tetapi datanya dikosongkan sebaik sahaja sesi penyemak imbas tamat.

Tambahan Pertimbangan

• Hanya nilai rentetan boleh disimpan terus dalam storan penyemak imbas. Gunakan JSON.stringify() untuk menyimpan jenis data yang lebih kompleks.
• Terdapat had saiz yang dikenakan oleh penyemak imbas. Semak dokumentasi penyemak imbas untuk mendapatkan butiran.
• Adalah disyorkan untuk mengasingkan mekanisme storan menggunakan pustaka tersuai atau menggunakan yang sedia ada. Ini memudahkan pengendalian data tanpa mengira jenis storan.

Sumber

• [Storan Penyemak Imbas Panduan](https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage)
• [localStorage](https://developer.mozi lla.org/en-US/docs/DOM/Storage#localStorage)
• [JSON](https://developer.mozilla.org/en-US/docs/JSON)
• [Pelayar Keserasian Storan](http://caniuse.com/namevalue-storage)

Atas ialah kandungan terperinci Bagaimana untuk Mengekalkan Pembolehubah JavaScript Hidup Selepas Muat Semula Halaman?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!