في JavaScript، على عكس لغات مثل Java، لا تحتوي على أي طرق طباعة أو إخراج، وعادةً ما يتم استخدام الطرق الأربع التالية لإخراج البيانات.
window.alert() لإظهار مربع تحذير.innerHTML للكتابة إلى عناصر HTMLdocument.write() المستند.console.log() للكتابة إلى وحدة تحكم المتصفح.استخدمها أدناه.
يقومبإنشاء ملف HTML جديد، ثم يستخدم VSCode لكتابة التعليمات البرمجية التالية.
<!DOCTYPE html>
<أتش تي أم أل>
<الرأس>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, original-scale=1">
<title>window.alert()</title>
</الرأس>
<الجسم>
<p>عرض النافذة المنبثقة</p>
<نوع البرنامج النصي = "نص/جافا سكريبت">
window.alert("هذا اختبار منبثق!");
</script>
</الجسم>
</html> ثم افتح الملف أعلاه بالمتصفح. عند فتحه، ستظهر النافذة المنبثقة التالية بعد النقر على "موافق"، سيتم إغلاق النافذة المنبثقة وسيتم عرض المحتوى على صفحة الويب.
<!DOCTYPE html>
<أتش تي أم أل>
<الرأس>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, original-scale=1">
<title>document.write()</title>
</الرأس>
<الجسم>
<p>اكتب مستند HTML</p>
<نوع البرنامج النصي = "نص/جافا سكريبت">
document.write(Date());
</script>
</الجسم>
</html> بعد إنشاء ملف HTML جديد وكتابة المحتوى أعلاه، يتم فتح المتصفح وستعرض الصفحة المحتوى التالي. يمكنك أن ترى أن كتابة الوقت الحالي باستخدام document.write() قد تمت بنجاح. ومع ذلك، تجدر الإشارة إلى أنه إذا تم تحميل document.write() في نفس الوقت مع محتوى آخر وقبل تحميل المحتوى، فيمكن عرضه مع محتوى آخر. ومع ذلك، إذا تم تنفيذ document.write() بعد تحميل محتوى الصفحة، فسيتم استبدال كل المحتوى الذي تم تحميله مسبقًا بالمحتوى المكتوب.
<!DOCTYPE html>
<أتش تي أم أل>
<الرأس>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, original-scale=1">
<title>document.write()</title>
</الرأس>
<الجسم>
<p>اكتب مستند HTML</p>
<button onclick="showDate()">وقت العرض</button>
<نوع البرنامج النصي = "نص/جافا سكريبت">
وظيفة عرض التاريخ () {
document.write(Date());
}
</script>
</الجسم>
</html> فيما يلي مقارنة قبل وبعد تنفيذ document.write() بعد تحميل الصفحة، مما يشير إلى أن استدعاء document.write() بعد تحميل الصفحة سيحل محل محتوى الصفحة السابقة.
قبل وبعد
JavaScript إذا كنت تريد الوصول إلى عنصر HTML معين، فيمكنك استخدام طريقة document.getElementById(id) ، ثم يمكنك استخدام innerHTML للحصول على محتوى العنصر أو إدراجه.
<!DOCTYPE html>
<أتش تي أم أل>
<الرأس>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, original-scale=1">
<title>innerHTML</title>
</الرأس>
<الجسم>
<p id="inner">التعامل مع عناصر HTML</p>
<button onclick="changeContext()">انقر لتعديل المحتوى أعلاه</button>
<نوع البرنامج النصي = "نص/جافا سكريبت">
تغيير الوظيفةContext() {
document.getElementById("inner").innerHTML = "المحتوى المعدل";
}
</script>
</الجسم>
</html> قبل التعديل بعد التعديل
لاستخدام طريقة console.log() ، يحتاج متصفحنا إلى دعم تصحيح الأخطاء بشكل عام. ثم استخدم مفتاح الاختصار F12 لفتح وضع التصحيح والانتقال إلى قائمة Console في نافذة التصحيح. نظرًا لأنني أستخدم Edge هنا، يتم عرض وحدة التحكم ويعتمد هذا الاختيار للمتصفح بشكل أساسي على تفضيلاتك الخاصة، ولكن يوصى باستخدام Chrome بشكل عام.
<!DOCTYPE html>
<أتش تي أم أل>
<الرأس>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, original-scale=1">
<title>console.log</title>
</الرأس>
<الجسم>
<p>عرض في وضع تصحيح المتصفح</p>
<نوع البرنامج النصي = "نص/جافا سكريبت">
فار رقم1 = 11؛
فار رقم 2 = 10؛
console.log(num1 + num2);
</script>
</الجسم>
</html>
، ما ورد أعلاه يتعلق بالإخراج في JavaScript، على الرغم من عدم وجود طريقة System.out.println() للطباعة والإخراج مثل Java، إلا أن الطرق الأربع المذكورة أعلاه يمكنها تلبية احتياجات التطوير اليومية بشكل أساسي.