4 วิธีการแสดงผลใน JavaScript
ก) ใช้ innerHTML เขียนลง Element HTML
เหมาะสำหรับแสดงผลบนเว็บเพจจริง
<html> <body> <p id="demo"></p> <script>
document.getElementById("demo").innerHTML = 10 + 10;
</script> </body> </html>ผลลัพธ์: แสดง 20 บนหน้าเว็บ
ข) ใช้ document.write()
เขียนตรงไปยัง Document Stream ใช้ได้เฉพาะขณะโหลดหน้าเท่านั้น หากใช้หลังโหลดเสร็จจะล้างหน้าเว็บ
<html> <body> <script>
document.write(2 + 3);
</script> </body> </html>ผลลัพธ์: 5
ค) ใช้ console.log()
แสดงผลใน Console ของ Developer Tools (F12) เหมาะสำหรับ Debug และข้อมูลจำนวนมาก/JSON
<html> <body> <script>
console.log(2 + 3);
</script> </body> </html>ผลลัพธ์ใน Console: 5
ง) ใช้ alert()
แสดงกล่องข้อความ Popup บังคับให้ผู้ใช้กด OK ก่อนดำเนินการต่อ
<html> <body> <script>
alert(2 + 3);
</script> </body> </html>ผลลัพธ์: Popup แสดง 5
สรุปการเลือกใช้
- innerHTML - แสดงผล UI จริง
- console.log - Debug, JSON, Object, Array (แนะนำมากที่สุด)
- alert - แจ้งเตือนสำคัญ/ทดสอบด่วน
- document.write - ใช้น้อยมาก เฉพาะการทดสอบพื้นฐาน
