ก่อนที่จะปรากฏตัวของ HTML5 หากนักพัฒนาต้องการเก็บข้อมูลจำนวนเล็กน้อยบนไคลเอนต์มันสามารถนำไปใช้ได้ผ่านคุกกี้ แต่มีหลายจุดที่ไม่เพียงพอสำหรับคุกกี้:
•ขนาดของคุกกี้ภายใต้ชื่อโดเมนแต่ละชื่อถูก จำกัด ไว้ที่ 4KB
•คุกกี้จะรวมไว้ในคำขอ HTTP แต่ละครั้งซึ่งจะทำให้เกิดข้อมูลที่ซ้ำกัน
•คุกกี้ไม่มีการเข้ารหัสระหว่างการส่งเครือข่ายและมีอันตรายจากความปลอดภัยที่ซ่อนอยู่
ฟังก์ชั่นการจัดเก็บเว็บจะถูกเพิ่มลงใน HTML5 Web Storage ได้รับการสนับสนุนจาก Firefox, Opera, Chrome, เบราว์เซอร์หลักของ Safari
รู้เบื้องต้นเกี่ยวกับการจัดเก็บเว็บWeb Storage แบ่งออกเป็นที่เก็บเซสชันและพื้นที่จัดเก็บในท้องถิ่น:
การจัดเก็บเซสชัน: คล้ายกับเซสชันระยะเวลาการอยู่รอดของข้อมูลที่บันทึกโดยการจัดเก็บเซสชันเหมือนกับระยะเวลาเซสชัน ที่เก็บข้อมูลในพื้นที่: ข้อมูลที่บันทึกโดยพื้นที่เก็บข้อมูลในเครื่องมักจะอยู่ในพื้นที่เสมอเว้นแต่ผู้ใช้หรือโปรแกรมจะชัดเจนอย่างชัดเจนข้อมูลเหล่านี้จะมีอยู่ในเดียวกันวัตถุหน้าต่างมีสองแอตทริบิวต์ของ SessionStorage และ LocalStorage ซึ่งเป็นตัวแทนของที่เก็บเซสชันและที่เก็บข้อมูลในท้องถิ่นตามลำดับ ฟังก์ชั่นและการใช้งานทั้งสองนี้เกือบจะเหมือนกัน แต่พวกเขามีช่วงเวลาการรอดชีวิตที่แตกต่างกันสำหรับการบันทึกข้อมูล ที่เก็บข้อมูลให้คุณลักษณะและวิธีการต่อไปนี้ (นำ LocalStorage เป็นตัวอย่าง):
• localstorage.length: รับจำนวนคู่คีย์-ค่า;
• localstorage.key (ดัชนี): คีย์เพื่อรับดัชนีของดัชนีดัชนี;
• localstorage.getItem (คีย์): รับค่าที่สอดคล้องกับคีย์ที่ระบุ;
• localstorage.setItem (คีย์, ค่า): บันทึกคู่คีย์-ค่าที่ระบุ;
• localstorage.removeitem (คีย์): ลบคู่คีย์-ค่าของคีย์-ค่าที่สอดคล้องกับคีย์ที่ระบุ;
• localstorage.clear (): ลบคู่คีย์-ค่าทั้งหมด
ควรสังเกตว่าทั้งคีย์และค่าจะต้องเป็นสตริง ดังนั้นข้อมูลบางอย่างที่ไม่ใช่สตริงเราสามารถแปลงเป็นรูปแบบสตริงผ่าน JSON และวิธีอื่น ๆ
Web Storage เก็บข้อมูลหลายข้อมูลด้วย JSONเราคุ้นเคยกับการใช้งานพื้นฐานของคุณลักษณะและวิธีการที่เกี่ยวข้องผ่านโปรแกรมขนาดเล็ก:
•ข้อมูลพื้นฐานของการเข้านักเรียน (รวมถึงจำนวนหมายเลขโรงเรียนชื่อเกรดเพศ) ใช้หมายเลขโรงเรียนเป็นค่าสำคัญในการจัดเก็บในที่เก็บข้อมูลท้องถิ่น
•สอบถามข้อมูลพื้นฐานของนักเรียนผ่านหมายเลขโรงเรียน
•แสดงข้อมูลของนักเรียนทุกคน
ก่อนอื่นเราออกแบบหน้า HTML
เนื้อหาคัดลอกรหัส XML/HTML ไปยังคลิปบอร์ด