# مقدمة إلى BOM Location في JavaScript
تعتبر الـ BOM (اختصاراً لـ Browser Object Model) جزءاً مهماً من البيئة التي توفرها المتصفحات لتشغيل JavaScript. في هذه المقالة، سنركز على كائن `location` الذي يعد جزءاً من الـ BOM ويمثل الـ URL الحالي للصفحة. يساعد كائن `location` المطورين في الحصول على معلومات حول الـ URL وتحديثها وتغييرها.
## ما هو كائن Location؟
كائن Location هو جزء من نافذة المتصفح (window object) ويسمح لك بالوصول إلى خصائص متعددة للـ URL الحالي، بالإضافة إلى بعض الأساليب لتحديث أو تغيير عنوان الـ URL أو إعادة تحميل الصفحة.
## خصائص كائن Location
### 1. `location.href`
هذه الخاصية تمثل العنوان الكامل للصفحة. يمكنك استخدامها للحصول على الـ URL الحالي أو لتحديثه.
// الحصول على الـ URL الحالي
console.log(window.location.href);
// تغيير الـ URL الحالي
window.location.href = 'https://www.example.com';
### 2. `location.protocol`
هذه الخاصية تعطيك البروتوكول المستخدم مثل `http:` أو `https:`.
console.log(window.location.protocol); // مثلاً: 'https:'
### 3. `location.host`
تعطيك هذه الخاصية اسم المضيف مع رقم المنفذ إذا كان محدداً.
console.log(window.location.host); // مثلاً: 'www.example.com:80'
### 4. `location.hostname`
تشبه `location.host` ولكنها لا تحتوي على رقم المنفذ.
console.log(window.location.hostname); // مثلاً: 'www.example.com'
### 5. `location.port`
تعطيك رقم المنفذ المستخدم في الـ URL.
console.log(window.location.port); // مثلاً: '80'
### 6. `location.pathname`
تعرض لك هذه الخاصية مسار الصفحة.
console.log(window.location.pathname); // مثلاً: '/path/to/page'
### 7. `location.search`
تعطيك سلسلة الاستعلام (query string) الموجودة في الـ URL.
console.log(window.location.search); // مثلاً: '?search=query'
### 8. `location.hash`
تعطيك الجزء الموجود بعد الـ `#` في الـ URL.
console.log(window.location.hash); // مثلاً: '#section1'
## أساليب كائن Location
### 1. `location.assign()`
يستخدم لتغيير الـ URL الحالي إلى URL جديد، مماثل لتغيير `location.href`.
window.location.assign('https://www.example.com');
### 2. `location.replace()`
يغير الـ URL الحالي دون إضافة الإدخال إلى سجل التاريخ (history) للمتصفح.
window.location.replace('https://www.example.com');
### 3. `location.reload()`
يعيد تحميل [شركة برمجة مصرية] الصفحة الحالية. يمكنك تمرير قيمة `true` لإعادة تحميل الصفحة من الخادم بدلاً من الذاكرة المؤقتة.
// إعادة تحميل الصفحة من الذاكرة المؤقتة
window.location.reload();
// إعادة تحميل الصفحة من الخادم
window.location.reload(true);
## خاتمة [شركة برمجة مصرية]
يعتبر كائن `location` أداة قوية للتعامل مع الـ URL الخاص بالصفحة في JavaScript. يمكن استخدامه للحصول على معلومات مفصلة عن الـ URL أو لتغيير الـ URL وإعادة توجيه المستخدمين. من خلال فهم كيفية عمل خصائص وأساليب كائن `location`، يمكنك تحسين تجربة المستخدم وتطبيق منطق مخصص في تطبيقات الويب الخاصة بك.