JavaScript HTML DOM bộ

HTMLCollection đối tượng

getElementsByTagName() phương thức trả về HTMLCollection 。

HTMLCollection là danh sách các phần tử HTML (bộ sưu tập) là loại mảng.

Mã dưới đây chọn tất cả các phần tử <p> trong tài liệu:

Mẫu

var x = document.getElementsByTagName("p");

Các phần tử trong bộ sưu tập này có thể được truy cập thông qua chỉ số.

Để truy cập vào phần tử <p> thứ hai, bạn có thể viết như sau:

y = x[1];

Thử trực tiếp

Ghi chú:Chỉ số bắt đầu từ 0.

HTML HTMLCollection độ dài

length Thuộc tính xác định số lượng phần tử trong HTMLCollection:

Mẫu

var myCollection = document.getElementsByTagName("p");
document.getElementById("demo").innerHTML = myCollection.length;

Thử trực tiếp

Giải thích mẫu:

  • Tạo bộ sưu tập tất cả các phần tử <p>
  • Hiển thị độ dài bộ sưu tập

length Thuộc tính này có ích khi bạn cần duyệt qua các phần tử trong bộ sưu tập:

Mẫu

Thay đổi màu nền của tất cả các phần tử <p>:

var myCollection = document.getElementsByTagName("p");
var i;
for (i = 0; i < myCollection.length; i++) {
    myCollection[i].style.backgroundColor = "red";
}

Thử trực tiếp

HTMLCollection không phải là mảng!

HTMLCollection có vẻ giống như mảng, nhưng không phải là mảng.

Bạn có thể duyệt qua danh sách và lấy phần tử thông qua tham chiếu số (như mảng).

Nhưng, bạn không thể sử dụng các phương pháp mảng đối với HTMLCollection, chẳng hạn như valueOf()、pop()、push() hoặc join()。