HTML Local Storage
- ບ່ອນໜ້າຫລັງ HTML5 Drag and Drop
- ບ່ອນໜ້າຫລັງ ການປຶກສາຄອງກັບຄອງ HTML5
HTML Local Storage: ບຸງຄຸນກວ່າ cookies.
ຫຍັງຈະເປັນ HTML Local Storage?
ຜ່ານການຄອບຄອບທ້ອງຖິ່ນ (Local Storage), ຄະນະຄວາມພາບສະແດງ web ສາມາດຄອບຄອບຂໍ້ມູນທ້ອງຖິ່ນໃນບຸກຄອນຂອງຜູ້ຄົນ.
ກ່ອນ HTML5, ຂໍ້ມູນຂອງຄະນະຄວາມພາບສະແດງຈະສາມາດຄອບຄອບໃນ cookie ເພື່ອການຮຽກຮ້ອງຂອງທະນາຄານ. ການຄອບຄອບທ້ອງຖິ່ນມີຄວາມປອດໄພຫຼາຍກວ່າ, ແລະສາມາດຄອບຄອບຂໍ້ມູນຫຼາຍຫຼາຍທີ່ບໍ່ມີຜົນກະທົບຕໍ່ຄວາມສະແດງຂອງເວັບໄຊ.
ບໍ່ແມ່ນ cookie, ການຄອບຄອບມີຂໍ້ຈຳກັດຫຼາຍຫຼາຍ (ຢ່າງໜ້ອຍ 5MB), ແລະຂໍ້ມູນຈະບໍ່ຖືກສົ່ງໄປຫາທະນາຄານ.
ການຄອບຄອບທ້ອງຖິ່ນຜ່ານພາກວັດທະນະທຳ (origin) (ຜູ້ບໍລິຫານແລະຂັ້ນຕອນ). ທຸກໆໜ້າ, ຈາກພາກວັດທະນະທຳ, ສາມາດຄອບຄອບແລະເຂົ້າເຖິງຂໍ້ມູນດຽວກັນ.
ການສະໜັບສະໜູນບູບປະຊາຊົນອາກາດ
ຄູ່ມືໃນຕາມການສະໜັບສະໜູນ Local Storage ຂອງບູບປະຊາຊົນອາກາດທີ່ໄດ້ຮັບການສະໜັບສະໜູນໄດ້ທັງໝົດ.
API | |||||
Web Storage | 4.0 | 8.0 | 3.5 | 4.0 | 11.5 |
ບັນດາບັນດາບັນດາອົງກອນ HTML Local Storage
HTML Local Storage ສະໜັບສະໜູນບັນດາບັນດາບັນດາອົງກອນທີ່ບັນທຶກຂໍ້ມູນໃນບູບປະຊາຊົນອາກາດ:
- window.localStorage - ບັນທຶກຂໍ້ມູນທີ່ບໍ່ມີສະຖານະຕາຍ
- window.sessionStorage - ບັນທຶກຂໍ້ມູນສຳຫຼັບ session (ຂໍ້ມູນຈະສູນເສຍເມື່ອປິດເບື້ອງບູບປະຊາຊົນອາກາດ)
ບໍ່ມີການບັນທຶກຄວາມສະໜັບສະໜູນ localStorage/sessionStorage ຂອງບູບປະຊາຊົນອາກາດ:
if (typeof(Storage) !== "undefined") { // ການຂຽນຂອງ localStorage/sessionStorage } else { // ຂ້ອຍຂ້ອຍ! ບໍ່ສາມາດສະໜັບສະໜູນ Web Storage .. }
ບັນດາຄວາມຄິດຄີ່ມ localStorage
ບັນດາຄວາມຄິດຄີ່ມ localStorage ບໍ່ມີສະຖານະຕາຍ. ບໍ່ມີການລົບບັນດາຄວາມຄິດຄີ່ມເມື່ອປິດບູບປະຊາຊົນອາກາດທີ່ຈະກາຍມາໃນມື້, ອາທິດ ຫລື ປີ.
ຄວາມຈຳນວນ
// ບັນທຶກ localStorage.setItem("lastname", "Gates"); // ຄົ້ນຫາ document.getElementById("result").innerHTML = localStorage.getItem("lastname");
ຄວາມເຫັນທີ່ມີຫຍັງ:
- ສ້າງຄຳນວຍຄານ/ຄຳນວຍຄານ localStorage ທີ່: name="lastname", value="Gates"
- ຄົ້ນຫາຄຳນວຍຄານ "lastname" ແລະບັນທຶກມັນເຂົ້າໃນປະກອບທີ່ id="result"
ຄົນທີ່ມີຫຍັງກໍ່ສາມາດຂຽນນີ້ໄດ້:
// ບັນທຶກ localStorage.lastname = "Gates"; // ຄົ້ນຫາ document.getElementById("result").innerHTML = localStorage.lastname;
ຂັ້ນຕອນທີ່ກຳລັງການກຳຈັດ "lastname" localStorage ແມ່ນ:
localStorage.removeItem("lastname");
ຄຳເຫັນ: ຄຳວ່າຊື່/ຄຳນວຍຄວາມຕ້ອງໄດ້ຖືກບັນທຶກເປັນຄວາມຄິດຄີ່ມ. ຖ້າຈະຕ້ອງການບັນທຶກເປັນຮູບແບບອື່ນໆໃຫ້ຈັງກັນ!
ບົດສະຫຼຸບ: ບົດສະຫຼຸບນີ້ໄດ້ນັບຄັດສະນະການຄຳລັກກັບຄະແນນລະຫວ່າງຜູ້ນຳໃຊ້ລະບຸການຄຳລັກຄະແນນ: ຄຳສັ່ງຂອງຄວາມຄວາມຄິດຄີ່ມຂື້ນຕາມຊັ້ນ.
ຄວາມຈຳນວນ
if (localStorage.clickcount) { localStorage.clickcount = Number(localStorage.clickcount) + 1; } else { localStorage.clickcount = 1; } document.getElementById("result").innerHTML = "ທ່ານໄດ້ຫລັງການຊັກບັນພຽງຄັ້ງ " + localStorage.clickcount + " ຄັ້ງ.";
sessionStorage ເປັນອັນດຽວ
sessionStorage ເປັນອັນດຽວກັບ localStorage, ແຕ່ບໍ່ອອກຈາກຄວາມຫວັງວ່າຂໍ້ມູນຈະຖືກບັງຄັບບັນທຶກໃນ session. ຖ້າຜູ້ນຳໃຊ້ປິດໜ້າເວັບໄຊບັນຊີບາດ, ຂໍ້ມູນຈະຖືກລຶບອອກ.
ຄັ້ງທີ່ລາວທີ່ຂ້ອຍຈະທຳຂອງຄົນໃນ session ນີ້ ທີ່ຫລັງການຊັກບັນພຽງຄັ້ງ:
ຄວາມຈຳນວນ
if (sessionStorage.clickcount) { sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1; } else { sessionStorage.clickcount = 1; } document.getElementById("result").innerHTML = "ໃນ session ນີ້,ທ່ານໄດ້ຫລັງການຊັກບັນພຽງຄັ້ງ " + sessionStorage.clickcount + " ຄັ້ງ.";
- ບ່ອນໜ້າຫລັງ HTML5 Drag and Drop
- ບ່ອນໜ້າຫລັງ ການປຶກສາຄອງກັບຄອງ HTML5