Phần tử DOM HTML getElementsByTagName()
Ví dụ
Thay đổi nội dung HTML của phần tử <li> đầu tiên trong danh sách:
const list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("li")[0].innerHTML = "Milk";
Hãy tự mình thử »Số phần tử <p> trong "myDIV":
const element = document.getElementById("myDIV");
const nodes = element.getElementsByTagName("p");
let numb = nodes.length;
Hãy tự mình thử »Thay đổi kích thước phông chữ của phần tử <p> thứ hai trong "myDIV":
const element = document.getElementById("myDIV");
element.getElementsByTagName("p")[1].style.fontSize = "24px";
Hãy tự mình thử »Thêm ví dụ dưới đây.
Sự miêu tả
Phương thức getElementsByTagName()
trả về một tập hợp tất cả các phần tử con có tên thẻ nhất định.
Phương thức getElementsByTagName()
trả về HTMLCollection trực tiếp.
Bộ sưu tập HTML
HTMLCollection là một tập hợp (danh sách) các phần tử HTML giống như mảng.
Thuộc tính length trả về số phần tử trong bộ sưu tập.
Các phần tử có thể được truy cập theo chỉ mục (bắt đầu từ 0).
Một HTMLCollection đang hoạt động. Nó được tự động cập nhật khi tài liệu được thay đổi.
Cú pháp
element .getElementsByTagName( tagname )
Thông số
Parameter | Description |
tagname | Required. The tagname of the elements. |
Giá trị trả về
Kiểu | Sự miêu tả |
Sự vật | Một đối tượng HTMLCollection . Một tập hợp các phần tử có tên thẻ được chỉ định. Các phần tử được sắp xếp khi chúng xuất hiện trong tài liệu. |
Thêm ví dụ
Thay đổi màu nền của tất cả phần tử <p> bên trong "myDIV":
const div = document.getElementById("myDIV");
const nodes = x.getElementsByTagName("P");
for (let i = 0; i < nodes.length; i++) {
nodes[i].style.backgroundColor = "red";
}
Hãy tự mình thử »Thay đổi màu nền của phần tử thứ tư (chỉ mục 3) bên trong "myDIV":
const div = document.getElementById("myDIV");
div.getElementsByTagName("*")[3].style.backgroundColor = "red";
Hãy tự mình thử »Sử dụng tham số "*".
Thay đổi màu nền của tất cả các thành phần bên trong "myDIV":
const div = document.getElementById("myDIV");
const nodes = div.getElementsByTagName("*");
for (let i = 0; i < nodes.length; i++) {
nodes[i].style.backgroundColor = "red";
}
Hãy tự mình thử »Hỗ trợ trình duyệt
element.getElementsByTagName()
được hỗ trợ trong tất cả các trình duyệt:
Chrome | Edge | Firefox | Safari | Opera | IE |
Yes | Yes | Yes | Yes | Yes | Yes |