إخراج جافا سكريبت
إمكانيات عرض جافا سكريبت
يمكن لجافا سكريبت "عرض" البيانات بطرق مختلفة:
- الكتابة في عنصر HTML باستخدام
innerHTML
. - الكتابة في إخراج HTML باستخدام
document.write()
. - الكتابة في مربع تنبيه باستخدام
window.alert()
. - الكتابة في وحدة تحكم المتصفح ، باستخدام
console.log()
.
باستخدام innerHTML
للوصول إلى عنصر HTML ، يمكن لـ JavaScript استخدام document.getElementById(id)
الطريقة.
تحدد السمة id
عنصر HTML. innerHTML
تحدد الخاصية محتوى HTML :
مثال
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>
يعد تغيير خاصية HTML الداخلية لعنصر HTML طريقة شائعة لعرض البيانات بتنسيق HTML.
باستخدام document.write ()
لأغراض الاختبار ، من الملائم استخدام document.write()
:
مثال
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
سيؤدي استخدام document.write () بعد تحميل مستند HTML إلى حذف كل HTML الموجود :
مثال
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button type="button" onclick="document.write(5 + 6)">Try it</button>
</body>
</html>
يجب استخدام طريقة document.write () للاختبار فقط.
باستخدام window.alert ()
يمكنك استخدام مربع تنبيه لعرض البيانات:
مثال
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
يمكنك تخطي window
الكلمة الأساسية.
في JavaScript ، كائن window هو كائن النطاق العام ، وهذا يعني أن المتغيرات والخصائص والأساليب بشكل افتراضي تنتمي إلى كائن النافذة. هذا يعني أيضًا أن تحديد window
الكلمة الأساسية أمر اختياري:
مثال
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
alert(5 + 6);
</script>
</body>
</html>
باستخدام console.log ()
لأغراض التصحيح ، يمكنك استدعاء console.log()
الطريقة في المتصفح لعرض البيانات.
سوف تتعلم المزيد عن تصحيح الأخطاء في فصل لاحق.
مثال
<!DOCTYPE html>
<html>
<body>
<script>
console.log(5 + 6);
</script>
</body>
</html>
طباعة جافا سكريبت
لا تحتوي JavaScript على أي كائن طباعة أو طرق طباعة.
لا يمكنك الوصول إلى أجهزة الإخراج من JavaScript.
الاستثناء الوحيد هو أنه يمكنك استدعاء window.print()
الطريقة في المتصفح لطباعة محتوى النافذة الحالية.
مثال
<!DOCTYPE html>
<html>
<body>
<button onclick="window.print()">Print this page</button>
</body>
</html>