عند بناء مواقع تعتمد على عدم تحميل كل المحتوى بشكل كلي بل تحميل الجزء المطلوب فقط بواسطة طلبات الـ(Ajax) فإن عناصر التوجيه مهمه , فلو فرضنا أن رابط يجلب معلومات معينة فإننا نحتاج إلى أن يكون هذا الرابط معرف بالعنوان حتى يتسنى للجميع إستعماله مباشره دون الحاجة للضغط عليه في كل مره.
ومن أهم الأمثلة ألبوم الصور الذي يعمل بطلبات الأجاكس , عند تقليب الصور يجب أن توجد دلاله معينة للعنوان بحيث أن يقوم أحد بنسخ العنوان ومشاركته للأخرين فيقومو بطلب العنوان فتظهر لهم الصورة التي تملك العنوان
فالسؤال الرئيسي كيف يمكن تعديل العنوان بشكل مباشر في الصفحة دون الحاجه لتحميل المحتوى من جديد ؟
بإستخدام الجافا سكريبت يمكن عمل ذلك بطريقتين
أولا طريقة الهاش (Hash)
ويمكن فيها إضافة متغير في العنوان بعد ال Hash وإستعماله كدلاله فعند عمل طلب أجاكس معين أو تغيير يتم تغير الهاش
فعند تعيين المتغير في العنوان يتم تعريفه
window.location.hash='photoID-1';
وعند قراءته من العنوان يكون
var hash=window.location.hash;
طريقة التعديل المباشر في العنوان
وهيه ما تقوم بدعمها المتصفحات الجديده التي تدعم ال HTML5 مثل FF و Chrome بينما ما يزال Explorer لا يدعمها لذا ينصح بإستعمال الإضافة للموافقه مع جميع المتصفحات , ويتم فيها تعديل العنوان بشكل مباشر بإستعمال
history.pushState(stateObj, Title, URL);
//history.pushState({"id":101}, "new title", "/new-url/");
فيتم فيها تحويل الرابط بشكل كامل وإستعماله فيما بعد كطريقة توجيه معتاده , مع ملاحظة أنه في حال الضغط على back من خلال المتصفح لن يعمل كالمعتاد لأنه تم تغيير العنوان الحالي إلى عنوان جديد ولكن المتصفح يعتبر أن المتغير هو الحالي
هذه الطرق تساعد جدا في عمل توجيهات مختلفه وحفظ عناوينها من خلال الأجاكس.
دمتم بخير إلى تدوينة أخرى
