编辑这个页面须要登录或更高权限！

HTML DOM className 属性

HTML DOM Element 对象

className属性将指定元素的class属性值设置或返回为字符串。

如果指定的元素没有类属性或未设置类属性，则返回一个null字符串。

语法：

返回className属性：

element.className

设置className属性：

element.className = cName
document.getElementById("x").className = "para";
测试看看‹/›

浏览器兼容性

所有浏览器完全支持className属性：

属性
className是是是是是

属性值

值描述
cName一个字符串变量，表示当前元素的类或以空格分隔的类

技术细节

返回值：一个字符串，表示元素的类或类的空格分隔列表
DOM版本：DOM级别1

更多实例

返回第一个<div>元素的类名称：

var x = document.getElementsByTagName("div")[0].className;
测试看看‹/›

用新名称覆盖现有的类名称：

<div class="myDiv">这是一个DIV元素</div>

<script>
var x = document.getElementsByTagName("div")[0];
x.className = "anotherClass";
</script>
测试看看‹/›

要将类添加到元素中而不覆盖现有值，请插入空格和新的类名称：

<div class="myDiv">这是一个DIV元素</div>

<script>
var x = document.getElementsByTagName("div")[0];
x.className += " anotherClass";
</script>
测试看看‹/›

找出<div>元素是否具有“shadow”类：

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

if (x.className.indexOf("shadow") != -1) {
   alert("Yes... The DIV has 'shadow' class");
} else {
   alert("False");
}
测试看看‹/›

相关参考

CSS教程：CSS选择器

CSS参考：CSS#id选择器

CSS Reference: CSS .class 选择器

JavaScript参考：字符串indexOf()方法

HTML DOM参考：HTML DOM classList属性

HTML DOM参考：HTML DOM getElementsByClassName()方法

HTML DOM参考：HTML DOM getElementById()方法

HTML DOM参考：HTML DOM querySelector()方法

HTML DOM Element 对象

JavaScript History 对象HTML DOM Element 对象