HTML DOM Element className అటువంటి విలు

నిర్వచనం మరియు ఉపయోగం

className అటువంటి విలు సెట్ చేయడమో లేదా బాక్సు పొందడమో చేస్తుంది.

మరింత విచారణ కొరకు చూడండి:

Element classList అటువంటి విలు

Document getElementsByClassName() పద్ధతి

HTML DOM Style 对象

ఉదాహరణ

ఉదాహరణ 1

అటువంటి విలు సెట్ చేయండి అంగామి సమానం విలు:

element.className = "myStyle";

మీరే ప్రయత్నించండి

ఉదాహరణ 2

"myDIV" యొక్క class అటువంటి విలు పొందండి:

let value = document.getElementById("myDIV").className;

మీరే ప్రయత్నించండి

ఉదాహరణ 3

రెండు క్లాస్ పేర్ల మధ్య మార్పు చేయండి:

if (element.className == "myStyle") {
  element.className = "newStyle";
} else {
  element.className = "myStyle";
}

మీరే ప్రయత్నించండి

సలహా:పేజీ కింద మరిన్ని ఉదాహరణలు అందుబాటులో ఉన్నాయి.

సంకేతం

className అటువంటి విలు బాక్సు పొందండి:

HTMLElementObject.className

className అటువంటి విలు సెట్ చేయండి:

HTMLElementObject.className = class

అటువంటి విలు

విలు వివరణ
class

ఎలిమెంట్ యొక్క క్లాస్ పేరు.

పలు క్లాస్లను అంతరాంతరం చేసి జోడించండి, ఉదాహరణకు "test demo".

తిరిగి వచ్చే విలువ

రకం వివరణ
పదం ఎలిమెంట్ యొక్క క్లాస్, లేదా అంతరాంతరం చేసిన క్లాస్ జాబితా.

మరిన్ని ఉదాహరణలు

ఉదాహరణ 4

మొదటి <div> ఎలిమెంట్ యొక్క class ప్రతిపాదనను పొందండి (ఉన్నట్లయితే):

let value = document.getElementsByTagName("div")[0].className;

మీరే ప్రయత్నించండి

ఉదాహరణ 5

పలు క్లాస్లు కలిగిన క్లాస్ ప్రతిపాదనను పొందండి:

<div id="myDIV" class="myStyle test example">
<p>I am myDIV.</p>
</div>
let value = document.getElementById("myDIV").className;

మీరే ప్రయత్నించండి

ఉదాహరణ 6

క్లాస్ ప్రతిపాదనను కొత్త క్లాస్ ప్రతిపాదనతో పునఃస్థాపించండి:

element.className = "newClassName";

మీరే ప్రయత్నించండి

ఉదాహరణ 7

ఇప్పటికే ఉన్న విలువను అదనంగా జోడించడానికి కాస్పేస్ మరియు క్లాస్ జోడించండి:

element.className += " class1 class2";

మీరే ప్రయత్నించండి

ఉదాహరణ 8

ఇది "myDIV" కు "myStyle" క్లాస్ ఉన్నట్లయితే ఫంట్ పరిమాణాన్ని మార్చండి:

const elem = document.getElementById("myDIV");
if (elem.className == "mystyle") {
  elem.style.fontSize = "30px";
}

మీరే ప్రయత్నించండి

ఉదాహరణ 9

పేజీ పైభాగాన్ని నుంచి 50 పిక్సెల్స్ స్క్రాల్ చేసినప్పుడు "test" క్లాస్ జోడించబడుతుంది:

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

మీరే ప్రయత్నించండి

బ్రౌజర్ మద్దతు

అన్ని బ్రౌజర్లు మద్దతు ఇస్తాయి element.classNameకుడివైపు

క్రోమ్ ఐఇ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఒపెరా
క్రోమ్ ఐఇ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఒపెరా
మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు

ప్రసంగం పేజీలు

CSS శిక్షణాగృహం:CSS సంకేతాలు

CSS సంప్రదాయం:CSS .class ఎంపికకర్త