ดูและแก้ไขพื้นที่เก็บข้อมูลในเครื่อง

Kayce Basques

Sofia Emelianova

คำแนะนำนี้จะแสดงวิธีใช้เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome เพื่อดู แก้ไข และลบคู่คีย์-ค่า localStorage พื้นที่เก็บข้อมูลในเครื่องจะบันทึกข้อมูลในเซสชันของเบราว์เซอร์

ดูคีย์และค่า localStorage รายการ

1. เปิดเครื่องมือสำหรับนักพัฒนาเว็บในเว็บไซต์ที่ต้องการตรวจสอบ

2. ไปที่แอปพลิเคชัน > พื้นที่เก็บข้อมูล และขยายพื้นที่เก็บข้อมูลในเครื่อง คลิกโดเมนเพื่อดูคู่คีย์-ค่า

   

3. หากต้องการดูตัวอย่างค่าใต้ตาราง ให้เลือก 2 ค่า

   

หากต้องการรีเฟรชคู่คีย์-ค่าด้วยตนเอง ให้คลิก รีเฟรชในแถบการดำเนินการที่ด้านบน

กรองคู่คีย์-ค่า

หากต้องการค้นหาคู่คีย์-ค่าที่ต้องการอย่างรวดเร็ว ให้พิมพ์สตริงที่มีคีย์หรือค่าลงในช่องตัวกรองที่ด้านบน

สร้างคู่คีย์-ค่า localStorage ใหม่

1. ดูlocalStorageคู่คีย์-ค่าของโดเมน เช่น ในหน้าเดโมนี้
2. ดับเบิลคลิกส่วนที่ว่างของตาราง เครื่องมือสำหรับนักพัฒนาเว็บจะสร้างแถวใหม่และโฟกัสเคอร์เซอร์ในคอลัมน์คีย์
3. ป้อนคู่คีย์-ค่าใหม่

แก้ไขคีย์หรือค่า localStorage

1. ดูคู่คีย์-ค่า localStorage ของโดเมน ตัวอย่างเช่น ในหน้าสาธิตนี้
2. ดับเบิลคลิกเซลล์ในคอลัมน์คีย์หรือค่าเพื่อแก้ไขคีย์หรือค่าดังกล่าว
3. รีเฟรชหน้าเพื่อใช้

ลบคู่คีย์-ค่า localStorage

1. ดูคู่คีย์-ค่า localStorage คู่ของโดเมน เช่น ในหน้าเดโมนี้
2. คลิกคู่คีย์-ค่าเพื่อเลือก
3. คลิก Delete ในแถบการดำเนินการที่ด้านบนเพื่อนำคู่ที่เลือกออก
4. หรือคลิก ล้างทั้งหมด เพื่อนำคู่ทั้งหมดออก

โต้ตอบกับ localStorage จากคอนโซล

เนื่องจากคุณสามารถเรียกใช้ JavaScript ในคอนโซล และเนื่องจากคอนโซลมีสิทธิ์เข้าถึงบริบท JavaScript ของหน้า คุณจึงโต้ตอบกับ localStorage จากคอนโซลได้

1. เปิดคอนโซลใน DevTools
2. หากต้องการเข้าถึงlocalStorageคู่คีย์-ค่าของโดเมนอื่นที่ไม่ใช่หน้าเว็บที่คุณกําลังดูอยู่ ให้เลือกบริบท JavaScript ที่ต้องการจากเมนูแบบเลื่อนลงของบริบทในแถบการดำเนินการที่ด้านบน
3. เรียกใช้นิพจน์ localStorage ในคอนโซล เช่นเดียวกับที่ใช้ใน JavaScript