เราสามารถใช้ JavaScript แสดงผลข้อมูลได้หลากหลายวิธี ดังนี้
- แสดงข้อมูลในเอลิเมนต์ของ HTML โดยใช้ innerHTML
- แสดงเนื้อหาใน HTML ด้วย
document.write()
- แสดงข้อมูลทางกล่องข้อความแจ้งเตือนด้วย
window.alert()
- แสดงข้อมูลไปที่คอนโซลของเบราเซอร์ด้วย
console.log()
การใช้งาน innerHTML
เราสามารถใช้เมธอด document.getElementById(id)
เพื่อเข้าถึงเอลิเมนต์ของ HTML โดยการอ้างถึงแอททริบิวต์ id ดังนี้
<body>
<p id="content"></p>
<script>
document.getElementById("content").innerHTML = "www.dcrub.com";
</script>
</body>
การใช้งานเมธอด document.write()
เราสามารถแสดงข้อมูลในเว็บเพจ HTML โดยใช้เมธอด document.write()
ดังนี้
<body>
<p id="content"></p>
<script>
document.write("www.dcrub.com");
</script>
</body>
หมายเหตุ : การใช้เมธอด document.write()
หลังจากโหลดเพจเสร็จแล้ว จะเป็นการลบเนื้อหาทั้งหมดใน HTML แล้วแสดงค่าใหม่ออกมาแทน
แจ้งเตือนด้วย window.alert()
เราสามารถแสดงข้อความออกทางกล่องแจ้งเตือนด้วย window.alert()
ดังนี้
<script>
window.alert("ข้อความแจ้งเตือน");
</script>
การใช้งานเมธอด console.log()
เราสามารถตรวจสอบความถูกต้องของข้อมูลโดยการแสดงข้อมูลออกทางคอนโซลของเว็บเบราเซอร์ โดยการใช้เมธอด console.log()
ดังนี้
<script>
console.log(9 * 5);
</script>
การใช้เมธอด window.print()
เราสามารถใช้เมธอด window.print()
เพื่อสังพิมพ์หน้าเว็บเพจปัจจุบันได้ ดังนี้
<button onclick="window.print()">พิมพ์หน้านี้</button>