الدوال البرمجية
print أو console.log
confirm
prompt
ما هو الفرق بين ال document – console – window
هو الامر البرمجي المسؤول عن الوصول الى صفحة ال html، ويتضمن جميع اكواد html بداخله مثل head و body و div و غيرها.
هو دالة في لغة JavaScript تستخدم لعرض نافذة تنبيه للمستخدم برسالة نصية.
تقوم هذه النافذة بإيقاف تنفيذ البرنامج مؤقتًا حتى يقوم المستخدم بالنقر على زر "موافق" أو "إلغاء".
يتم استخدام alert في الغالب للتواصل مع المستخدم وتقديم رسائل بسيطة أو تحذيرات. على سبيل المثال:
مثال كود javascript
alert("مرحبًا! أهلاً بك في موقعنا.");
// عند تنفيذ هذا الكود، ستظهر نافذة تنبيه برسالة "مرحبًا!
// أهلاً بك في موقعنا."
// ويجب على المستخدم النقر على زر "موافق" لإغلاق النافذة.هو طريقة مهمة لكتابة محتوى إلى نافذة المستعرض في لغة JavaScript.
ومع ذلك، يُفضل عدم استخدامها لأنها قديمة وتسبب تأثيرات غير متوقعة في بعض الحالات.
إذا تم استدعاء هذه الدالة بعد أن تم تحميل المستند بالكامل، فإنها ستقوم بمسح المحتوى الحالي للصفحة وكتابة المحتوى الجديد بدلاً منه.
قد يؤدي ذلك إلى فقدان المحتوى الحالي وتدمير تجربة المستخدم.
عادةً ما يُفضل استخدام طرق أكثر حديثًا لتعديل محتوى صفحة HTML، مثل استخدام DOM (النموذج الكائني للمستند) الذي سيتم شرحه في البند التالي.
document.write
هي نفس فكرة window.write ولكنها تستخدم مع متغير document الذي يمثل المستند (صفحة HTML).
يمكن استخدام document.write لكتابة محتوى إلى الصفحة أثناء تحميلها.
ومع ذلك، على غرار window.write، يفضل تجنب استخدامها لنفس الأسباب المذكورة أعلاه.
DOM النموذج الكائني للمستند
DOM هو اختصار لـ Document Object Model، وهو مفهوم مهم في تطوير واجهات الويب.
يشير DOM إلى تمثيل بنية الصفحة HTML كنموذج كائن، حيث يتم تمثيل كل عنصر في الصفحة (مثل العناصر، النصوص، الروابط، الصور، إلخ) ككائن في JavaScript.
يتيح DOM للمطورين التفاعل مع محتوى الصفحة وتغييره ديناميكياً وبناء تجارب مستخدم متميزة.
عند استخدام DOM، يمكنك الوصول إلى العناصر الفردية في الصفحة وتغيير محتواها أو نمطها أو إضافة عناصر جديدة بناءً على ردود الفعل أو التفاعلات مع المستخدم.
من أمثلة واجهات الويب التي تعتمد بشكل كامل على DOM هي تطبيقات الويب التفاعلية مثل Gmail و Facebook.
ملاحظة
للاستفادة من DOM في JavaScript، يمكنك استخدام العديد من الوظائف والطرق المتاحة، مثل getElementById و querySelector للوصول إلى العناصر، و innerHTML و innerText لتغيير محتواها، و addEventListener للتفاعل مع الأحداث (مثل النقر على زر).