الحصول على معلومات عناوين URL في جافاسكربت - ProgrammerTech
Language:

Search

الحصول على معلومات عناوين URL في جافاسكربت

  • Share this:
الحصول على معلومات عناوين URL في جافاسكربت

الحصول على معلومات عنوان URL

الحصول على معلومات عنوان URL, سوف نشرح في هذا الدرس عن الموقع location. سوف نبدأ بـ location.protocol, إذا قمنا بإستخدام هذه الخاصية سوف يتم إعادة البروتوكول الخارج للرابط. بما أننا حالياً نستخدم سيرفر محلي لن يظهر لنا بشكل صحيح و البروتوكول يكون إما http أو https يمكنكم البحث في جوجل عن معنى البروتوكولات http و https.

 

الخصائص المستخدمة مع location في جافاسكربت

  1. خاصية location.protocol.
  2. خاصية location.href.
  3. خاصية location.hostname.
  4. خاصية location.pathname.
  5. خاصية location.reload.
  6. خاصية location.assign.
  7. خاصية location.replace.

 

معرفة البروتوكول المستخدم location.protocol

يمكننا معرفة البروتوكول المستخدم في صفحات الويب بواسطة الأمر location.protocol سواء الموقع موجود على سيرفر محلي أو خارجي.

var protocl = location.protocol;
alert(location.protocol);

أنشأنا متغير و عيننا له أنه نريد معرفة البروتوكول للصفحة الحالية, و عرضنا البيانات عبر alert. عند تنفيذ الكود السابق هنا سوف يعطينا file: لأننا نستعرض هذا عبر السيرفر المحلي. أما إذا نريد منه عرض البروتوكول لموقع ما مثلاً نستخدم موقعنا و نجرب عليه عبر فتح أدوات المطورين Inspect و الذهاب إلى Console و نقوم بكتابة الأمر الآتي

alert(location.protocol)

مباشرتاً سوف يعطينا في النافذة المنبثقة كلمة https أي هو البروتوكول المستخدم مع هذه الصفحة.

1-48.webp

 

عرض رابط الموقع الحالي location.href

الأمر location.href يمكننا إذا نريد عرض رابط الموقع الذي نحن به في الوقت الحالي نستخدم الأمر location.href. مثلاً لنجرب على موقعنا. نستخدم الأمر:

alert(location.href)

عند تشغيل الكود سوف يعطينا رابط الموقع بواسطة ديالوك منبثق.

2-43.webp

 

عرض دومين الموقع نستخدم location.hostname

أمر location.hostname نستطيع من خلاله أن نعرض الهوست نيم للموقع أو الدومين للموقع الذي نريد إستعراض دومينه.

alert(location.hostname)

أنشأنا نافذة منبثقة و طلبنا بها أن تعرض لنا الدومين للموقع الموجودين حالياً به.

3-39.webp

 

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

 

معرفة المسار نستخدم location.pathname

بواسطة أمر location.pathname يمكننا أن نعرف نحن أين نقف حالياً, أو المسار الحالي الموجودين به.

alert(location.pathname)

 

4-35.webp

لآحظنا أنه إستعرض لنا مسار القسم الذي متواجدين به. سوف نستفيد من هذه الأمور عند الدخول بعمق بعالم تصميم المواقع وسنكون بحاجة لها لمعرفة الموقع الحالي مثلاً أو تمركز الصفحات...الخ.

 

إعادة تحميل صفحة الويب location.reload

يُستخدم location.reload لتحديث الصفحة عمل refrech مثلاً نربطه بصورة في ملف html و عند النقر عليه يعمل تحديث للصفحة الحالية. وعند كتابة هذا الأمر في Console لصفحة ويب و عند النقر على زر Enter سوف يعمل تحديث للصفحة.

location.reload()

هنا عند النقر على زر Enter سوف يعمل تحديث للصفحة فوراً.

 

أخذ المستخدم لصفحة اخرى و عودته location.assign

أمر location.assign يُستخدَم من أجل أخذ المستخدم لصفحة ثانية يتم تحديدها مع الحفاظ على صفحته الحالية. الذي هو بها في حال قرر العودة للصفحة بدون فقدان معلوماتها. إذا كتبنا هذا الأمر في Console موقع ما.

location.assign("https://www.masa-lib.com/")

كما لآحظنا عند كتابة الأمر و الضغط على Enter أخذنا للموقع الذي حددناه له مع بقاء سهم الرجوع للصفحة السابقة.

 

إستبدال الصفحة الحالية بدون عودة location.replace

أمر location.replace هذا الأمر يستبدل لنا الصفحة الحالية بصفحة جديدة نحددها و لم يعد بالإمكان العودة للصفحة الحالية لأن إستبدلها لنا فمثلاً إذا كتبنا هذا الأمر.

location.replace("https://www.masa-lib.com/")

عند الضغط على Enter سوف يأخذنا للموقع المطلوب و لا يمكن الرجوع للخلف أي تحذف الصفحة السابقة نهائياً.


Muhammad Alush

Muhammad Alush

إسمي محمد تركي العلوش من سورية من ريف حلب الشرقي 1994, محب للتقنية و التعلم الذاتي, و جميع خبراتي تعلمتها ذاتياً, و اللغات البرمجية التي أتقنها هي html, css, javascript, php, c, python بالإضافة إلى حبي الكبير لمجال الشبكات.

موقعي programmer-tech.com