ตัวอย่าง
ได้รับเนื้อหา HTML ของแรก <p> องค์ประกอบ (index 0) ภายในเอกสาร:
var nodelist = document.getElementsByTagName("P").item(0).innerHTML;
ผลจากการ nodelist จะเป็น:
The first p element in the document.
ลองตัวเอง» เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
item() วิธีการส่งกลับโหนดที่ดัชนีที่ระบุในวัตถุ NodeList
โหนดจะเรียงตามที่ปรากฏในรหัสที่มาและดัชนีเริ่มต้นที่ 0
คอลเลกชันโหนดวัตถุของโหนดลูกเป็นตัวอย่างของวัตถุ NodeList
หมายเหตุ: มีสองวิธีในการเข้าถึงโหนดที่ดัชนีที่ระบุในรายการโหนดคือ:
รูปแบบนี้:
document.body.childNodes.item(0);
// The first child node of <body> Try it
จะผลิตผลเช่นเดียวกับรูปแบบนี้:
document.body.childNodes[0];
// The first child node of <body> Try it
คุณสามารถใช้วิธีสิ่งที่คุณต้องการ แต่วิธีการที่พบมากที่สุดคือ [ดัชนี]
เคล็ดลับ: ใช้ ระยะเวลาใน คุณสมบัติที่จะกลับจำนวนโหนดในวัตถุ NodeList
สนับสนุนเบราว์เซอร์
วิธี | |||||
---|---|---|---|---|---|
item() | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
วากยสัมพันธ์
ค่าพารามิเตอร์ พารามิเตอร์ ชนิด ลักษณะ index Number จำเป็นต้องใช้ ดัชนีของโหนดที่คุณต้องการที่จะกลับมาในรายการโหนด
หมายเหตุ: ดัชนีเริ่มต้นที่ 0
รายละเอียดทางเทคนิค
กลับค่า: วัตถุโหนดคิดเป็นโหนดที่ดัชนีที่ระบุ
หมายเหตุ: คืน null หากหมายเลขดัชนีอยู่นอกช่วง DOM รุ่น หลักระดับ 1 Nodelist วัตถุ
ตัวอย่างอื่น ๆ
ตัวอย่าง
ได้รับเนื้อหา HTML ของแรก <p> องค์ประกอบ (index 0) ภายใน <div> องค์ประกอบ:
var div = document.getElementById("myDIV");
var nodelist =
div.getElementsByTagName("P")[0].innerHTML; ผลจากการ nodelist จะเป็น:
First p element in div. ลองตัวเอง»
ตัวอย่าง
เปลี่ยนเนื้อหา HTML ของแรก <p> องค์ประกอบ (index 0) ภายใน <div> องค์ประกอบ:
var div = document.getElementById("myDIV");
div.getElementsByTagName("P")[0].innerHTML
= "Paragraph changed"; ลองตัวเอง»
ตัวอย่าง
ห่วงผ่านองค์ประกอบทั้งหมดที่มี class = "เด็ก" ใน <div> องค์ประกอบและเปลี่ยนสีพื้นหลังของพวกเขา
var div = document.getElementById("myDIV");
var nodelist =
div.getElementsByClassName("child");
var i;
for (i = 0; i <
nodelist.length; i++) {
nodelist[i].style.backgroundColor = "red";
} ลองตัวเอง»
หน้าเว็บที่เกี่ยวข้อง
HTML DOM อ้างอิง: nodelist .length ทรัพย์สิน
HTML DOM อ้างอิง: องค์ประกอบ .childNodes ทรัพย์สิน
HTML DOM อ้างอิง: href="met_element_getelementsbyclassname.html"> element . getElementsByClassName() Method href="met_element_getelementsbyclassname.html"> element . getElementsByClassName() Method
HTML DOM อ้างอิง: href="met_element_getelementsbytagname.html"> element . getElementsByTagName() Method href="met_element_getelementsbytagname.html"> element . getElementsByTagName() Method
HTML DOM อ้างอิง: href="met_element_queryselectorall.html"> element . querySelectorAll() Method href="met_element_queryselectorall.html"> element . querySelectorAll() Method
HTML DOM อ้างอิง: href="met_document_getelementsbyclassname.html">document. getElementsByClassName() Method href="met_document_getelementsbyclassname.html">document. getElementsByClassName() Method
HTML DOM อ้างอิง: href="met_doc_getelementsbyname.html">document. getElementsByName() Method href="met_doc_getelementsbyname.html">document. getElementsByName() Method
HTML DOM อ้างอิง: href="met_document_getelementsbytagname.html">document. getElementsByTagName() Method href="met_document_getelementsbytagname.html">document. getElementsByTagName() Method
HTML DOM อ้างอิง: href="met_document_queryselectorall.html">document. querySelectorAll() Method href="met_document_queryselectorall.html">document. querySelectorAll() Method