JavaScript HTML DOM koleksiyonu

HTMLCollection nesnesi

getElementsByTagName() Metot, HTMLCollection Nesne.

HTMLCollection nesnesi, sınıf arrayi olan HTML elementi listesidir (koleksiyon).

Aşağıdaki kod, belgedeki tüm <p> elementlerini seçer:

Örnek

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

Bu koleksiyondaki elementler, indeks numarası ile erişilebilir.

İkinci <p> elementine erişmek için şöyle yazabilirsiniz:

y = x[1];

Kendi kendinize deneyin

Açıklama:İndeks 0'dan başlar.

HTML HTMLCollection uzunluğu

length HTMLCollection içindeki element sayısını tanımlar:

Örnek

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

Kendi kendinize deneyin

Örnek açıklaması:

  • Tüm <p> elementlerinin koleksiyonunu oluşturun
  • Koleksiyonun uzunluğunu gösterir

length Özellikler, koleksiyonda elemanları dolaşmanız gerektiğinde kullanışlıdır:

Örnek

Tüm <p> elementlerinin arka plan rengini değiştirin:

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

Kendi kendinize deneyin

HTMLCollection array değildir!

HTMLCollection array gibi görünse de, array değildir.

Listeyi dolaşabilir ve sayısal referansla elementleri (dizilere benzer şekilde) ele alabilirsiniz.

Ancak, HTMLCollection'ı array yöntemlerini kullanarak, örneğin valueOf()vepop()vepush() veya join().