วิธี getElementsByTagName() ของ HTML DOM
คำนิยามและวิธีใช้
getElementsByTagName() สามารถกลับคืนชุดขององค์ประกอบที่มีชื่อแบบฐานที่กำหนด
วลี
document.getElementsByTagName(tagname)
ชี้แจง
ลำดับขององค์ประกอบที่กลับมาจาก getElementsByTagName() นั้นเป็นลำดับขององค์ประกอบในเอกสาร
ถ้าส่งมอบตัวอักษรพิเศษ "*" ให้กับ getElementsByTagName() มันจะคืนรายชื่อทั้งหมดขององค์ประกอบในเอกสาร โดยลำดับขององค์ประกอบนั้นเป็นลำดับที่องค์ประกอบนั้นอยู่ในเอกสาร
คำเตือนและหมายเหตุ
หมายเหตุ:ข้อความที่ส่งมอบให้กับ getElementsByTagName() อาจแบ่งประเภทตามขนาดตัวอักษรไม่ได้
ตัวอย่าง
ตัวอย่าง 1
<html>
<head>
<script type="text/javascript">
function getElements()
{
var x=document.getElementsByTagName("input")
;
alert(x.length);
}
</script>
</head>
<body>
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()"
value="How many input elements?" />
</body>
</html>
ตัวอย่าง 2
คุณสามารถใช้วิธี getElementsByTagName() ที่จะหาบันทึกขององค์ประกอบ HTML ทุกชนิดได้ ตัวอย่างเช่น รหัสที่ด้านล่างนี้สามารถหาทั้งหมดของตารางในเอกสารได้
var tables = document.getElementsByTagName("table")
;
alert ("This document contains " + tables.length + " tables");
ตัวอย่าง 3
ถ้าคุณเข้าใจโครงสร้างของเอกสารดีมาก คุณก็สามารถใช้วิธี getElementsByTagName() ที่จะเข้าถึงองค์ประกอบเฉพาะที่เจาะจงของเอกสารด้วย ตัวอย่างเช่น รหัสที่ด้านล่างนี้สามารถหาประโยคที่สี่ของเอกสารได้
var myParagragh = document.getElementsByTagName("p")[3]
;
อย่างไรก็ตาม พวกเรายังคงคิดว่า ถ้าคุณต้องการที่จะปฎิบัติต่อองค์ประกอบเฉพาะที่เจาะจง ใช้วิธี getElementById() จะมีประสิทธิภาพมากขึ้น