getElementById
getElementById() เป็นเมธอด DOM ใช้เพื่อส่งคืนองค์ประกอบที่มีแอตทริบิวต์ ID ด้วยค่าที่ระบุ นี่เป็นวิธีการทั่วไปวิธีหนึ่งใน HTML DOM และถูกใช้เกือบทุกครั้งที่เราต้องการจัดการองค์ประกอบในเอกสารของเรา เมธอดนี้คืนค่า null หากไม่มีองค์ประกอบที่มี ID ที่ระบุ รหัสควรไม่ซ้ำกันภายในหน้า อย่างไรก็ตาม หากมีองค์ประกอบที่มี ID ที่ระบุมากกว่าหนึ่งองค์ประกอบ ก็จะส่งคืนองค์ประกอบสุดท้ายในโค้ดจาวาสคริปต์
ตัวอย่าง-1
ในตัวอย่างต่อไปนี้ มีแท็กย่อหน้าที่มีข้อความภายใน "GetElementById" และมีรหัสที่เรียกว่า "element" การใช้เมธอด DOM "document.getElementById()" ข้อความภายในแท็กย่อหน้าจะถูกเข้าถึงและค่าจะแสดงในเอาต์พุต หากไม่มี ".innerHtml" document.getElementById จะไม่สามารถอ่านส่วนข้อความภายในของแท็กใดๆ ได้
<html>
<body>
<p id="element">GetElementById</p>
<script>
var s = document.getElementById("element").innerHTML;
document.write(s);
</script>
</body>
</html> ผลลัพธ์
GetElementById GetElementById
ตัวอย่าง-2
ในตัวอย่างต่อไปนี้ โดยใช้เมธอด DOM "getElementById" เราได้แทนที่ส่วนข้อความดั้งเดิม "GetElementById" ด้วยข้อความ "Tutorix" และผลลัพธ์จะแสดงในผลลัพธ์
<html>
<body>
<p id="element">GetElementById</p>
<script>
document.getElementById("element").innerHTML = "Tutorix";
</script>
</body>
</html> ผลลัพธ์
Tutorix
