جافاسكربتسجل الصفحات

مفهوم سجل الصفحات

عند فتح أي تبويب ( Tab ) جديد في المتصفح فأنه يقوم ببناء سجل ( History ) خاص له ليحفظ فيه ترتيب الصفحات التي يقوم المستخدم بالدخول إليها. لهذا السبب يمكنه العودة إلى الصفحات السابقة أو التالية بنفس الترتيب الذي شاهدها فيه.

جافاسكربت تتيح لك التعامل مع السجل الخاص بالمتصفح، مما يعني أنه يمكن جعل المستخدم ينتقل إلى الصفحة السابقة أو التالية الموجودة في السجل، معرفة عدد الصفحات المخزنة فيه، أو الذهاب لصفحة محددة من الصفحات الموجودة فيه.

الكائن history

الكائن history أو window.history يحتوي على دوال يمكنك استخدامها للإنتقال إلى أي صفحة موجودة في السجل الذي يتم بناؤه لحظة قيام المستخدم بفتح تبويب في المتصفح.

الإنتقال إلى الصفحة السابقة في السجل

للعودة إلى الصفحة السابقة الموجودة في سجل المتصفح يمكنك استخدام الدالة history.back() و هي ستقوم بفتح الصفحة السابقة مكان الصفحة الحالية.

في المثال التالي قمنا بإضافة زر يتيح للمستخدم العودة إلى الصفحة السابقة التي كان قد شاهدها.

<button onclick="history.back()">Go to previous page</button>

الإنتقال إلى الصفحة التالية في السجل

للعودة إلى الصفحة التالية الموجودة في سجل المتصفح يمكنك استخدام الدالة history.forward() و هي ستقوم بفتح الصفحة التالية مكان الصفحة الحالية.

في المثال التالي قمنا بإضافة زر يتيح للمستخدم العودة إلى الصفحة التالية التي كان قد شاهدها.

<button onclick="history.forward()">Go to next page</button>

الإنتقال إلى صفحة محددة في السجل

للعودة إلى صفحة موجودة في سجل المتصفح يمكنك استخدام الدالة history.go() و تمرير رقم يشير لموقع الصفحة التي تريد العودة لها.

• في حال كان رقم الصفحة أصغر من 0 مثل 1- فهذا يعني أنك تريد العودة للصفحة السابقة.
• في حال كان رقم الصفحة أكبر من 0 مثل 1+ فهذا يعني أنك تريد العودة للصفحة التالية.
• في حال كان رقم الصفحة يساوي من 0 فهذا يعني أنك تريد تحديث الصفحة نفسها.

في المثال التالي قمنا بإضافة أزرار تتيح للمستخدم الإنتقال بشكل مباشر إلى صفحات موجودة في السجل.

<button onclick="history.go(-2)">Go back 2 pages</button>
<button onclick="history.go(-1)">Go back 1 page</button>
<button onclick="history.go(0)">Reload the page</button>
<button onclick="history.go(1)">Go forward 1 page</button>
<button onclick="history.go(2)">Go forward 2 pages</button>

الحصول على عدد الصفحات الموجودة في السجل

لمعرفة عدد الصفحات التي شاهدها المستخدم بعد قيامه بفتح المتصفح يمكنك استخدام الخاصية history.length.

في المثال التالي قمنا بعرض عدد الصفحات الموجودة في السجل.

document.write('Total pages in browser history: ' + history.length);