ธรรมชาติคืออะไร History API?

เข้าใจประวัติศาสตร์ API

ประวัติศาสตร์ API เป็นคุณลักษณะที่มีประสิทธิภาพที่ช่วยให้แอปพลิเคชันเว็บสามารถปฏิสัมพันธ์กับ stack ประวัติของเบราว์เซอร์ได้ นี้ช่วยให้นักพัฒนาสามารถเปลี่ยน URL และจัดการการนำทางโดยไม่ต้องทำให้เกิดการโหลดหน้าเต็ม ปรับปรุงประสบการณ์ของผู้ใช้

ฟังก์ชันหลักของประวัติศาสตร์ API

ประวัติศาสตร์ API ประกอบด้วยหลายวิธีที่ช่วยให้นักพัฒนาสามารถจัดการประวัติของเบราว์เซอร์ได้:

• history.pushState(): เพิ่มรายการใหม่ใน stack ประวัติของเบราว์เซอร์
• history.replaceState(): แก้ไขรายการประวัติปัจจุบันโดยไม่เพิ่มรายการใหม่
• history.back(): นำทางไปยังรายการก่อนหน้าใน stack ประวัติ
• history.forward(): เลื่อนไปยังรายการถัดไปใน stack ประวัติ
• history.go(): โหลดรายการที่ระบุใน stack ประวัติ ตามตำแหน่งที่เกี่ยวข้อง

การใช้ pushState และ replaceState

วิธี pushState และ replaceState มีประโยชน์มากสำหรับแอปพลิเคชันหน้าเดียว (SPAs) วิธีการเหล่านี้ช่วยให้นักพัฒนาสามารถอัปเดต URL ที่แสดงในแถบที่อยู่ของเบราว์เซอร์และ stack ประวัติโดยไม่ต้องเรียกใช้การรีเฟรชหน้าเต็ม

history.pushState({ page: 1 }, "", "page1.html");

ในตัวอย่างนี้ pushState เพิ่มรายการใหม่ใน stack ประวัติ และเปลี่ยน URL เป็น page1.html

การจัดการเหตุการณ์ด้วยประวัติศาสตร์ API

เพื่อจัดการกับเหตุการณ์การนำทางที่เกิดข