更多"Try it Yourself"下面的例子。
定义和用法
className属性集或返回元素（元素的类属性的值）的类名。
提示：性质相近的className是班级列表属性。
浏览器支持
| 属性 | |||||
|---|---|---|---|---|---|
| className | 是 | 是 | 是 | 是 | 是 |
句法
返回className属性：
HTMLElementObject .className设置className属性：
HTMLElementObject .className= class 属性值
| 值 | 描述 |
|---|---|
| class | 指定元素的类名。 要应用多个类，他们用空格隔开，像"test demo" |
技术细节
| 返回值： | 一个字符串，表示类，或一个类的空格分隔的列表，元素的 |
|---|
更多示例
例
得到的第一个的类名<div>在文档中元件(if any) ：
var x = document.getElementsByTagName("DIV")[0].className; x的结果将是：
mystyle 试一试» 例
如何获得一个元素的类名的其他例子：
var x = document.getElementsByClassName("mystyle")[0].className;
var y =
document.getElementById("myDIV").className; 试一试» 例
获取多类元素的类名：
<div id="myDIV" class="mystyle test example">I am a DIV element</div>
var x = document.getElementById("myDIV").className;x的结果将是：
mystyle text example 试一试» 例
覆盖现有的类名与一个新问题：
<div id="myDIV" class="mystyle">I am a DIV element</div>
document.getElementById("myDIV").className = "newClassName"; 试一试» 例
如果有一类"mystyle"在使用id =“myDIV”的元素，改变字体大小：
var x = document.getElementById("myDIV");
if (x.className ===
"mystyle") {
x.style.fontSize = "30px";
} 试一试» 例
当用户向下滚动从顶部50个像素，类名-在不同的滚动位置的类名之间切换"test"将被添加到一个元素(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
= "";
}
}
试一试» 相关页面
CSS教程： CSS选择器
CSS参考： CSS选择器的.class
HTML DOM参考： HTML DOM classList Property
HTML DOM参考： HTML DOM getElementsByClassName()方法
HTML DOM参考： HTML DOM Style对象
<元素对象