Metode HTML DOM Element getElementsByTagName()

Definisi dan penggunaan

getElementsByTagName() Metode ini mengembalikan kumpulan anak elemen dengan tajuk yang ditentukan, dalam bentuk objek NodeList.

Petikan:Nilai parameter "*" Kembalikan semua anak elemen.

Lihat juga:

Metode getElementsByClassName()

Metode querySelector()

Metode querySelectorAll()

NodeList

NodeList Adalah kumpulan nod seperti array (senarai).

Anda boleh mengakses nod dalam senarai melalui indeks (pangkat). Indeks bermula daripada 0.

Sifat lengthKembalikan bilangan nod dalam senarai.

Contoh

Contoh 1

Tukar kandungan HTML bagi elemen <li> pertama dalam senarai:

const list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("li")[0].innerHTML = "Milk";

Coba Sendiri

Contoh 2

Bilangan elemen <p> dalam "myDIV":

const element = document.getElementById("myDIV");
const nodes = element.getElementsByTagName("p");
let numb = nodes.length;

Coba Sendiri

Contoh 3

Tukar saiz huruf bagi elemen <p> kedua dalam "myDIV":

const element = document.getElementById("myDIV");
element.getElementsByTagName("p")[1].style.fontSize = "24px";

Coba Sendiri

Contoh 4

Tukar warna latar belakang bagi semua elemen <p> dalam "myDIV":

const div = document.getElementById("myDIV");
const nodes = x.getElementsByTagName("P");
for (let i = 0; i < nodes.length; i++) {
  nodes[i].style.backgroundColor = "red";
}

Coba Sendiri

Contoh 5

Tukar warna latar belakang bagi elemen keempat (indeks 3) dalam "myDIV":

const div = document.getElementById("myDIV");
div.getElementsByTagName("*")[3].style.backgroundColor = "red";

Coba Sendiri

Contoh 6

Gunakan parameter "*" untuk mengubah warna latar belakang semua elemen dalam "myDIV":

const div = document.getElementById("myDIV");
const nodes = div.getElementsByTagName("*");
for (let i = 0; i < nodes.length; i++) {
  nodes[i].style.backgroundColor = "red";
}

Coba Sendiri

Syarat

element.getElementsByTagName(tagname)

Parameter

Parameter Deskripsi
tagname Diperlukan. Tag label anak-element.

Kembalian

Jenis Deskripsi
NodeList

Anak elemen yang memiliki tag yang diberikan.

Elemen diurutkan berdasarkan urutan munculnya di sumber kode.

Detil Teknologi

getElementsByTagName() Metode ini akan melintasi anak-nodes elemen yang ditentukan, mengembalikan array yang mengandung node Element (yang sebenarnya NodeList objek), yang mewakili semua elemen dokumen yang memiliki nama tag yang ditentukan. Urutan elemen dalam array adalah urutan mereka muncul dalam kode asal dokumen.

Perhatian

Interface Dokumentjuga mendefiniskan Cara kerja getElementsByTagName()ia adalah seperti yang lain, tetapi melintasi seluruh dokumen, bukannya melintasi anak-nodes elemen tertentu.

Jangan campur tangan dengan yang lain Cara kerja HTMLDocument.getElementsByName() Jangan campur tangan dengan yang lain, kerana ia berdasarkan nilai properti name elemen untuk mencari elemen, bukannya berdasarkan nama tag mereka.

Pemilihan Pelayar

Semua pelayar mendukung element.getElementsByTagName():

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Dipakai Dipakai Dipakai Dipakai Dipakai Dipakai