วิธี item() ของ HTMLCollection

คำนำหน้าและการใช้งาน

item() วิธีนี้คืนองค์ประกอบที่อยู่ที่ดัชนีที่กำหนดใน HTMLCollection

องค์ประกอบจะเรียงตามตำแหน่งที่มันปรากฏในโค้ดแรงต้น

สามารถใช้วิธีย่อแบบด้วย และจะได้ผลลัพธ์เดียวกัน:

var x = document.getElementsByTagName("P")[0];

ตัวอย่าง

ตัวอย่าง 1

เรียกข้อมูล HTML ขององค์ประกอบ <p> แรกของเอกสารนี้:

function myFunction() {
  var x = document.getElementsByTagName("P").item(0);
  alert(x.innerHTML);
}

ทดลองด้วยตัวเอง

รูปแบบการใช้งาน

HTMLCollection.item(index)

หรือ

HTMLCollection[index]

ค่าอุปกรณ์

อุปกรณ์ ประเภท คำอธิบาย
index Number

สำคัญต้องการคืนค่าดัชนีขององค์ประกอบที่ต้องการ

หมายเหตุ：ดัชนีเริ่มต้นจาก 0

ค่าที่คืน

องค์ประกอบ Elementแสดงว่าองค์ประกอบที่ตั้งอยู่ที่ดัชนีที่กำหนด

ถ้าเลขดัชนีเกินขอบเขต จะคืนค่า null。

การสนับสนุนโปรแกรมบราวเซอร์

วิธี Chrome IE Firefox Safari Opera
item() สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน

ตัวอย่างเพิ่มเติม

ตัวอย่าง 2

เปลี่ยนข้อมูล HTML ขององค์ประกอบ <p> แรก:

document.getElementsByTagName("P").item(0).innerHTML = "Paragraph changed";

ทดลองด้วยตัวเอง

ตัวอย่าง 3

วนลูปผ่านทุกองค์ประกอบที่มีคลาส "myclass" และเปลี่ยนสี 배경ของมัน:

var x = document.getElementsByClassName("myclass");
for (i = 0; i < x.length; i++) {
  x.item(i).style.backgroundColor = "red";
}

ทดลองด้วยตัวเอง

ตัวอย่าง 4

เรียกข้อมูล HTML ขององค์ประกอบ <p> แรกใน <div> ของคุณ:

var div = document.getElementById("myDIV");
var x = div.getElementsByTagName("P").item(0).innerHTML;

ทดลองด้วยตัวเอง

เพิ่มเติมข้อมูล

HTMLCollection：ตัวแปร length

HTML องค์ประกอบgetElementsByClassName() วิธี

HTML องค์ประกอบวิธี getElementsByTagName()