En son web geliştirme öğreticiler
 

HTML DOM className Propery

<Eleman Nesne

Örnek

Bir yönelik sınıfını ayarlama <div> id = "myDiv" ile eleman:

document.getElementById("myDIV").className = "mystyle";
Kendin dene "

Daha "Try it Yourself" Aşağıdaki örnekler.

Tanımı ve Kullanımı

className özelliği, ayarlar veya bir öğenin (Bir elemanın sınıf özelliğinin değeri) sınıf adını döndürür.

İpucu: ClassName için benzer bir özelliktir classlist özelliği.

Tarayıcı Desteği

özellik
className Evet Evet Evet Evet Evet

Sözdizimi

className özelliğini Dönüş:

HTMLElementObject .className

className özelliğini ayarlayın:

HTMLElementObject .className= class

Mülkiyet Değerler

değer Açıklama
class Bir elemanın sınıf adını belirtir. Gibi alanlarda ayırın, birden çok sınıf uygulamak için "test demo"

Teknik detaylar

Geri dönüş değeri: Bir elemanın sınıfı veya sınıfları bir boşluk koyarak, temsil eden bir String,
Örnekler

Diğer Örnekler

Örnek

Birinci sınıf adını alın <div> belgedeki elemanı (if any) :

var x = document.getElementsByTagName("DIV")[0].className;

X'in sonucu olacaktır:

mystyle
Kendin dene "

Örnek

Bir elemanın sınıf adını almak için nasıl diğer örnekler:

var x = document.getElementsByClassName("mystyle")[0].className;
var y = document.getElementById("myDIV").className;
Kendin dene "

Örnek

Birden sınıflarıyla bir öğenin sınıf isimlerini alın:

<div id="myDIV" class="mystyle test example">I am a DIV element</div>

var x = document.getElementById("myDIV").className;

X'in sonucu olacaktır:

mystyle text example
Kendin dene "

Örnek

yenisi ile mevcut bir sınıf adı üzerine yazma:

<div id="myDIV" class="mystyle">I am a DIV element</div>

document.getElementById("myDIV").className = "newClassName";
Kendin dene "

Örnek

Bir boşluk ve yeni sınıf adını eklemek, varolan değerleri üzerine yazmadan, bir öğeye bir sınıf eklemek için:

document.getElementById("myDIV").className += " anotherClass";
Kendin dene "

Örnek

Sınıfını varsa "mystyle" id = "myDiv" ile bir elemanda, onun font-boyutunu değiştirmek:

var x = document.getElementById("myDIV");

if (x.className === "mystyle") {
    x.style.fontSize = "30px";
}
Kendin dene "

Örnek

En 50 piksel aşağı kaydırdığı, sınıf ismi - farklı kaydırma pozisyonlar sınıf isimleri arasında geçiş "test" bir eleman eklenir (and removed when scrolled up again) .

window.onscroll = function() {myFunction()};

function myFunction() {
    if (document.body.scrollTop > 50) {
        document.getElementById("myP").className = "test";
    } else {
        document.getElementById("myP").className = "";
    }
}
Kendin dene "

İlgili Sayfalar

CSS Eğitimi: CSS Seçiciler

CSS Referans: CSS .class Seçici

HTML DOM Referans: HTML DOM classList Property

HTML DOM Referans: HTML DOM getElementsByClassName() Metodu

HTML DOM Referans: HTML DOM Stil Nesne

<Eleman Nesne