JavaScript: مخرجات جافاسكريبت

آخر تحديث: 2026-10-13

الخطوة الأولى في تعلم البرمجة عادةً ما تكون جعل برنامجك "يتحدث" — لدى JS أربع طرق للمخرجات، لكل منها حالة استخدامها الخاصة.

دوال BOM ذات صلة：console.log() textContent innerHTML alert()

1. console.log() — أفضل صديق للمطور

يُخرج console.log() المحتوى إلى وحدة تحكم المتصفح (F12 → Console). لا يمكن للمستخدمين رؤيته، لكن المطورين لا يمكنهم الاستغناء عنه للتصحيح.

هذه هي طريقة المخرجات التي ستستخدمها أكثر بكثير — حتى الآن. سواء كنت تتتبع خطأًا أو تتحقق من المنطق، console.log() هو أداتك المفضلة.

يفتح alert() حوارًا من multimodal يجب على المستخدم إغلاقه بالنقر على "موافق". يوقف سير عمل المستخدم ولا يُستخدم تقريبًا في الإنتاج — يظهر بشكل أساسي أثناء مرحلة التعلم.

انتبه: لا تضع alert() أبدًا داخل حلقة أثناء التصحيح، وإلا سيتعين عليك النقر على "موافق" عشرات المرات لإغلاق الحوارات — لا تسألني كيف أعرف.

2. document.write() — للاختبار فقط

يكتب document.write() المحتوى مباشرة في تدفق مستند HTML. إذا استدعيته بعد اكتمال تحميل الصفحة، سيستبدل الصفحة بأكملها — وهو ما لا تريده تقريبًا. استخدمه فقط للتجارب السريعة.

3. innerHTML — تحديث محتوى الصفحة

innerHTML هي الطريقة القياسية "لإخراج إلى الصفحة" — حدد عنصرًا وغيّر محتواه HTML. هذا هو أساس التلاعب بـ DOM، الذي سنغطيه بالتفصيل لاحقًا.

▶ مثال: مخرجات console.log() إلى وحدة التحكم

▶ مثال: مخرجات حوار alert()

▶ مثال: innerHTML لتحديث محتوى الصفحة

▶ مثال: document.write() ومخاطره

دوال BOM ذات صلة：console.log() textContent innerHTML alert()

❓ أسئلة شائعة

📖 ملخص

• console.log() هي أداة التحيح الأساسية — تُخرج إلى وحدة التحكم حيث لا يمكن للمستخدمين رؤيتها
• alert() يوقف واجهة المستخدم — استخدمه فقط أثناء التعلم، أبدًا في الإنتاج
• document.write() يستبدل الصفحة بأكملها إذا استُدعي بعد التحميل — مناسب فقط للتجارب المبكرة
• innerHTML هي الطريقة القياسية لتحديث محتوى الصفحة ويمكنها تفسير علامات HTML
• في التطوير الحقيقي، 99% من الوقت ستستخدم console.log() للتصحيح وinnerHTML لتحديث الصفحة
• لكل طريقة مكانها — اختر المناسب وستعمل بذكاء أكبر

📝 تمارين

1. مبتدئ: أنشئ صفحة بها زر، عند النقر عليه، يستخدم console.log() لإخراج اسمك وعمرك.
2. متوسط: أنشئ صفحة تستخدم innerHTML لإخراج قائمة غير مرتبة (3 عناصر على الأقل)، كل عنصر هو لغة برمجة تعلمتها.
3. تحدي: أنشئ صفحة "مقارنة طرق الإخراج" بأربعة أزرار، كل واحد يقابل إحدى طرق الإخراج الأربع. عند النقر، اعرض وصفًا لتلك الطريقة في نفس المنطقة على الصفحة (تخطي alert و document.write — simuleهما بـ innerHTML).

فريق Web-Tutorial التقني

منصة دروس برمجية يديرها عدة مطورين. كل درس يتم كتابته ومراجعته بواسطة مطورين متخصصين في المجال. نعمل على ضمان دقة وموثوقية المحتوى — إذا لاحظت أي مشكلة، فيرجى إخبارنا.

من نحن