تحتوي نافذة المتصفح على كائن محفوظات، والذي يستخدم لحفظ محفوظات الاستعراض.
إذا زارت النافذة الحالية ثلاثة عناوين URL، فإن كائن السجل يتضمن ثلاثة عناصر، وتكون الخاصية History.length تساوي 3.
يوفر كائن السجل سلسلة من الأساليب التي تسمح بالتنقل بين سجل التصفح:
window.history.back(): الانتقال إلى الصفحة السابقة التي تمت زيارتها، أي ما يعادل مفتاح الرجوع للمتصفح.
window.history.forward(): الانتقال إلى الصفحة التالية التي تمت زيارتها، أي ما يعادل مفتاح إعادة التوجيه في المتصفح.
window.history.go(num): يقبل عددًا صحيحًا كمعلمة وينتقل إلى الصفحة المحددة بواسطة العدد الصحيح، على سبيل المثال، go(1) يعادل Forward()، وgo(-1) يعادل back(. ).
window.history.pushState(): يضيف HTML5 طريقتين جديدتين إلى كائن السجل، window.history.pushState() و window.history.replaceState()، والتي تستخدم لإضافة وتعديل السجلات في سجل التصفح.
ملحوظة: 1. إذا تجاوز الموضع المنقول حدود سجل الوصول، فإن الطرق الثلاث المذكورة أعلاه لا تبلغ عن خطأ، ولكنها تفشل بصمت.
2. عند الإعداد، يتم عادةً تحميل الصفحة من ذاكرة التخزين المؤقت للمتصفح بدلاً من إعادة مطالبة الخادم بإرسال صفحة ويب جديدة.
دعونا نركز على: window.history.pushState()window.history.pushState(state, title, utl)، ينشئ كيان سجل في الصفحة. أضف مباشرة إلى التاريخ.
من بين المعلمات:
الحالة: كائن حالة مرتبط بعنوان URL المحدد عند تشغيل حدث popstate، سيتم تمرير هذا الكائن إلى وظيفة رد الاتصال. إذا لم تكن هناك حاجة لهذا الكائن، فيمكن ملء القيمة الخالية هنا.
title: عنوان الصفحة الجديدة، لكن جميع المتصفحات حاليًا تتجاهل هذه القيمة، لذا يمكن ملء القيمة null هنا.
عنوان URL: يجب أن يكون عنوان URL الجديد في نفس مجال الصفحة الحالية. سيعرض شريط عنوان المتصفح عنوان URL هذا.
ملاحظة: لن تؤدي طريقة PushState إلى تحديث الصفحة، ولكنها ستتسبب في تغيير كائن السجل، وسيتفاعل شريط العناوين.
مثال على التنفيذ:يستمع Html5 إلى طريقة مفتاح إرجاع Android ويعترضها كما يلي:
1. استمع إلى حدث popstate
window.addEventListener(popstate, function(){ //doSomething}, false)2. قم بإلغاء عملية الإرجاع الافتراضية، أي الاستماع لاعتراض مفتاح الإرجاع: أضف كيان سجل فارغ كبديل لكيان السجل الأصلي
window.history.pushState(null, null, #);
مثال:
<!DOCTYPE html><html> <meta name=viewport content=width=device-width> <script type=text/javascript> var count = 0; window.history.pushState(null, null, #); (popstate, function(e) { window.history.pushState(null, null, #); document.getElementById('logView').innerHTML = نقرات المستخدم ترجع + (++count) }) </script><body> <p id=logView>test</p></body></html>ما ورد أعلاه هو المحتوى الكامل لهذه المقالة وآمل أن يكون مفيدًا لدراسة الجميع وآمل أيضًا أن يدعم الجميع شبكة VeVb Wulin.