HTML DOM Element klasnaam
❮ Die elementvoorwerpVoorbeeld
Stel die klaskenmerk vir 'n element:
element.className = "myStyle";
Kry die klaskenmerk van "myDIV":
let value = document.getElementById("myDIV").className;
Wissel tussen twee klasname:
if (element.className == "myStyle") {
element.className = "newStyle";
} else {
element.className = "myStyle";
}
Meer voorbeelde hieronder.
Definisie en gebruik
Die classNameeienskap stel of gee 'n element se klaskenmerk terug.
Sintaksis
Gee die className-eienskap terug:
HTMLElementObject.className
Stel die className-eienskap:
HTMLElementObject.className = class
Eiendomswaardes
| Value | Description |
| class |
The class name(s) of an element. Separate multiple classes with spaces, like "test demo". |
Terugkeerwaarde
| Type | Description |
| String | The class, or a space-separated list of classes, of an element |
Meer voorbeelde
Kry die klaskenmerk van die eerste <div>-element (indien enige):
let value = document.getElementsByTagName("div")[0].className;
Kry 'n klaskenmerk met veelvuldige klasse:
<div id="myDIV" class="myStyle test example">
<p>I am myDIV.</p>
</div>
let value = document.getElementById("myDIV").className;
Oorskryf 'n bestaande klaskenmerk met 'n nuwe een:
element.className = "newClassName";
Om nuwe klasse by te voeg, sonder om bestaande waardes te oorskryf, voeg 'n spasie en die nuwe klasse by:
element.className += " class1 class2";
as "myDIV" 'n "myStyle"-klas het, verander die lettergrootte:
const elem = document.getElementById("myDIV");
if (elem.className == "mystyle") {
elem.style.fontSize = "30px";
}
As jy 50 pixels van die bokant van hierdie bladsy af blaai, word die klas "toets" bygevoeg:
window.onscroll = function() {myFunction()};
function myFunction() {
if (document.body.scrollTop > 50) {
document.getElementById("myP").className = "test";
} else {
document.getElementById("myP").className = "";
}
}
Blaaierondersteuning
element.classNameword in alle blaaiers ondersteun:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |
❮ Die elementvoorwerp