Kurs Önerileri:

HTML DOM Document getElementsByClassName() yöntemi

getElementsByClassName() Tanım ve Kullanım

getElementsByClassName() Yöntem, belirtilen sınıf adına sahip element koleksiyonunu döndürür. HTMLCollection.

getElementsByClassName() Özellikler yalnızca okunabilir.

HTMLCollection

HTMLCollection HTML elementlerinin benzeri dizili bir koleksiyondur (listesi).

Koleksiyondaki elementlere indeksle erişilebilir (0'dan başlar).

length Özellik, koleksiyondaki element sayısını döndürür.

Ayrıca bakınız:

getElementById() yöntemi

getElementsByTagName() yöntemi

querySelector() yöntemi

querySelectorAll() yöntemi

HTMLCollection nesnesi

Örnek

Örnek 1

class="example" olan tüm elementleri alın:

const collection = document.getElementsByClassName("example");

Deneyin

Örnek 2

Aynı anda "example" ve "color" sınıfına sahip tüm elementleri alın:

const collection = document.getElementsByClassName("example color");

Deneyin

Örnek 3

class="example" olan element sayısı:

let numb = document.getElementsByClassName("example").length;

Deneyin

Örnek 4

class="example" olan tüm elementlerin arka plan rengini değiştirin:

const collection = document.getElementsByClassName("example");
for (let i = 0; i < collection.length; i++) {
  collection[i].style.backgroundColor = "red";
}

Deneyin

Sözdizimi

document.getElementsByClassName(classname)

Parametre

Parametre Açıklama
classname

Gerekli. Elemanın sınıf adı.

Boşlukla ayrılmış birden fazla sınıf adı alınabilir, örneğin "test demo".

Dönüş değeri

Tip Açıklama
Nesne

HTMLCollection nesnesi.

Belirtilen sınıf adına sahip elementlerin koleksiyonu.

Dokümanda出现的顺序对元素进行排序。

Tarayıcı Desteği

document.getElementsByClassName() DOM Level 1 (1998) özelliğidir.

Tüm tarayıcılar destekliyor:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Desteği 9-11 Desteği Desteği Desteği Desteği

İlgili Sayfalar

CSS Eğitimi:CSS dilbilgisi

CSS Kaynak Kılavuzu:CSS .class seçici

HTML DOM Kaynak Kılavuzu:element.getElementsByClassName()

HTML DOM Kaynak Kılavuzu:className Özelliği

HTML DOM Kaynak Kılavuzu:classList Özelliği

HTML DOM Kaynak Kılavuzu:Style Nesnesi