جافاسكربترابط الصفحة
- ما هو الكائن window.location؟
- الحصول على رابط الصفحة
- الحصول على البروتوكل المذكور في رابط الصفحة
- الحصول على إسم الدومين المذكور في رابط الصفحة
- الحصول على رقم البورت المذكور في رابط الصفحة
- الحصول على إسم الدومين مع رقم البورت المذكورين في رابط الصفحة
- الحصول على مسار الصفحة الحالية
- الحصول على جملة البحث المذكورة في رابط الصفحة
- الحصول على المعرّف المذكور في رابط الصفحة
- الإنتقال لصفحة جديدة
- تحديث الصفحة
ما هو الكائن window.location؟
الكائن window.location يحتوي على معلومات الوصول إلى الصفحة المفتوحة مثل رابط الصفحة كاملاً، البروتوكول المستخدم لطلب الصفحة، مسار الصفحة في الموقع، إسم الموقع أو الدومين الذي توجد عليه الصفحة، كلمات الإستعلام المدخلة في الرابط، بالإضافة إلى إسم المعرف لعنصر محدد في الصفحة.
إذاً بواسطة هذا الكائن يمكنك استخراج جميع المعلومات الموجودة في رابط الصفحة التي يتصفحها المستخدم كما يلي.
الحصول على رابط الصفحة
يمكنك استخدام الخاصية window.location.href للحصول على رابط الصفحة الحالية كاملاً.
في المثال التالي قمنا بعرض رابط الصفحة الحالية.
مثال
الحصول على البروتوكل المذكور في رابط الصفحة
يمكنك استخدام الخاصية window.location.protocol للحصول على البروتوكل الموجود في بداية رابط الصفحة الحالية.
البروتوكل قد يكون 'http' أو 'https' على حسب إعدادات الموقع.
في المثال التالي قمنا بعرض البروتوكل المستخدم لجلب الصفحة.
مثال
الحصول على إسم الدومين المذكور في رابط الصفحة
يمكنك استخدام الخاصية window.location.hostname للحصول على إسم الدومين (أي إسم الموقع) من رابط الصفحة الحالية.
في المثال التالي قمنا بعرض إسم الدومين الذي توجد فيه الصفحة.
مثال
في حال استعراض الموقع على سيرفر محلي ( Local Server ) فإن إسم الدومين سيكون '127.0.0.1' أو 'localhost'.
و في حال استعرض الصفحة بشكل مباشر في المتصفح بدون تشغيلها على سيرفر فإن إسم الدومين سيكون نص فارغ '' لأنه بالأساس لا يوجد إسم دومين.
الحصول على رقم البورت المذكور في رابط الصفحة
يمكنك استخدام الخاصية window.location.port للحصول على رقم البورت ( Port ) الذي يظهر في رابط الصفحة.
في حال لم يكن رقم البورت ظاهراً في الرابط فإنها تعطينا نص فارغ ''.
المستخدم لا يضطر إلى ذكر رقم البورت لأن المتصفح يفعل ذلك عنه بشكل تلقائي أثناء الإتصال بالسيرفر فهو يعلم أن رقم البورت الإفتراضي الذي يتم استخدامه مع البروتوكل HTTP هو 80، و رقم البورت الإفتراضي الذي يتم استخدامه مع البروتوكل HTTPS هو 443.
في المثال التالي قمنا بعرض رقم البورت المستخدم لجلب الصفحة.
مثال
الحصول على إسم الدومين مع رقم البورت المذكورين في رابط الصفحة
يمكنك استخدام الخاصية window.location.host للحصول على إسم الدومين و رقم البورت اللذان يظهران في رابط الصفحة الحالية.
إذا كان رقم البورت لا يظهر في الرابط فإنها ترجع إسم الدومين فقط مثل الخاصية window.location.hostname.
في المثال التالي قمنا بعرض إسم الدومين مع رقم البورت المستخدم لجلب الصفحة.
مثال
الحصول على مسار الصفحة الحالية
يمكنك استخدام الخاصية window.location.pathname للحصول على مسار الصفحة الحالية المذكور في رابط الصفحة.
في المثال التالي قمنا بعرض مسار الصفحة المذكور في رابطها.
مثال
الحصول على جملة البحث المذكورة في رابط الصفحة
يمكنك استخدام الخاصية window.location.search للحصول على جملة البحث المذكورة في رابط الصفحة الحالية.
المقصود بجملة البحث هنا هو الباراميترات و القيم التي يتم تمريرها من الرابط إلى السيرفر و تسمى Query String.
الباراميترات و قيمها يتم تمريرها في الرابط من خلال إضافة علامة إستفهام ?
في آخره و ذكرها بعدها مباشرةً.
في المثال التالي قمنا بعرض جملة البحث المذكورة في رابط الصفحة.
مثال
الحصول على المعرّف المذكور في رابط الصفحة
يمكنك استخدام الخاصية window.location.hash للحصول على المعرّف المذكور في رابط الصفحة الحالية.
في حال لم يكن رابط الصفحة يحتوي على إسم معرّف تعطينا نص فارغ ''.
المعرّف يقصد به id يملكه عنصر في الصفحة.
عند تمرير إسم معرّف لعنصر في الرابط فإننا نضعه في آخر الرابط و نضع قبله الرمز #.
في المثال التالي قمنا بعرض إسم المعرّف المذكور في رابط الصفحة.
مثال
الإنتقال لصفحة جديدة
يمكنك استخدام الخاصية window.location.href أو الدالة window.location.assign() للإنتقال إلى صفحة جديدة.
في المثال التالي قمنا بالإنتقال إلى صفحة جديدة من خلال تمرير رابط الصفحة كقيمة للخاصية window.location.href.
المثال الأول
في المثال التالي قمنا بالإنتقال إلى صفحة جديدة من خلال تمرير رابط الصفحة للدالة window.location.assign().
المثال الثاني
تبديل الصفحة بصفحة جديدة
يمكنك استخدام الدالة window.location.replace() لتبديل الصفحة الحالية بصفحة جديدة.
في المثال التالي قمنا بتبديل الصفحة الحالية بصفحة جديدة من خلال تمرير رابط الصفحة الجديدة للدالة window.location.replace().
مثال
عند الإنتقال لصفحة جديدة بواسطة الخاصية window.location.href أو الدالة window.location.assign() فإن زر الرجوع إلى الصفحة السابقة يعمل بشكل طبيعي و يعيدك إلى الصفحة السابقة التي كانت مفتوحة قبلها. بينما عند تبديل الصفحة الحالية بواسطة الدالة window.location.replace() بصفحة جديدة فإنه لا يمكن العودة إلى الصفحة السابقة.
تحديث الصفحة
يمكنك استخدام الدالة window.location.reload() لتحديث الصفحة الحالية.
عند استدعائها يمكنك عدم تمرير أي قيمة لها أو تمرير القيمة false لجعل الصفحة يعاد عرضها بالإعتماد على النسخة السابقة منها المخزنة في المتصفح ( Cached page ). و في حال أردت جلب نسخة جديدة من الصفحة من السيرفر فجيب أن تمرر لها القيمة true.
في المثال التالي قمنا ببناء زر عند النقر عليه يقوم بتحديث الصفحة من السيرفر.
مثال
تحديث الصفحة بواسطة الدالة window.location.reload() يختلف عن استخدام زر التحديث الموجود في المتصفح، حيث أن التحديث بواسطة هذه الدالة يقوم بحذف أي قيم سابقة تم إدخالها في الحقول الموجودة في الصفحة.