HTML DOM NodeList ตัวแปร length

คำนิยามและวิธีใช้

ตัวแปร length คืนค่าจำนวนของตัวแปร NodeList:

ตัวแปร length คือที่เข้าออกเดียว:

ตัวอย่าง

ตัวอย่าง 1

ขอรับจำนวนอันย่อยที่อยู่ในเอกสาร:

const nodeList = document.body.childNodes;
let number = nodeList.length;

ทดสอบด้วยตัวเอง

ตัวอย่าง 2

ขอรับ <body> อันย่อย:

const nodeList = document.body.childNodes;

ทดสอบด้วยตัวเอง

ตัวอย่าง 3

จำนวนตัวเลือกทุกๆ ตัวใน div "myDIV":

const element = document.getElementById("myDIV");
let numb = element.childNodes.length;

ทดสอบด้วยตัวเอง

ตัวอย่าง 4

จำนวน <p> ใน div "myDIV":

const div = document.getElementById("myDIV");
const list = div.querySelectorAll("p");
let number = list.length;

ทดสอบด้วยตัวเอง

ตัวอย่าง 5

เดินทางทั้งหมดของตัวและเปลี่ยนขนาดของตัวเลือก <p> ใน div "myDIV":

const div = document.getElementById("myDIV");
const list = div.querySelectorAll("p");
for (let i = 0; i < list.length; i++) {
  list[i].style.fontSize = "red";
}

ทดสอบด้วยตัวเอง

ตัวอย่าง 6

เดินทางทั้งหมดของตัวเลือกทุกๆ ตัวและรวบรวมชื่อของตัวเลือกทุกๆ ตัว:

const list = document.body.childNodes;
let text = "";
for (let i = 0; i < list.length; i++) {
  text += list[i].nodeName + "<br>";
}

ทดสอบด้วยตัวเอง

ความเขียน

nodelist.length

ค่าที่กลับมา

ประเภท การอธิบาย
ตัวเลข จำนวนของตัวเลขใน NodeList

การสนับสนุนโดยบราวเซอร์

nodelist.length คือคุณสมบัติของ DOM Level 1 (1998)

ทุกบราวเซอร์ที่ใช้งานในปัจจุบันต่างสนับสนุนมัน:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
สนับสนุน 9-11 สนับสนุน สนับสนุน สนับสนุน สนับสนุน

หน้าที่เกี่ยวข้อง

entries() วิธี

forEach() วิธี

item() วิธี

keys() วิธี

values() วิธี

NodeList วัตถุ

childNodes() วิธี

querySelectorAll() วิธี

getElementsByName() วิธี