JavaScript Element classList 属性
-
JavaScript Element classList 属性
classList属性返回元素的类名,作为DOMTokenList对象。此属性对于在元素上添加,删除和切换CSS类很有用。classList属性是只读的,但是,您可以使用add()和remove()方法对其进行修改。跨浏览器解决方案: IE9及更早版本不支持classList属性。但是,您可以将className属性或正则表达式用于跨浏览器解决方案(请参阅本页底部的“更多示例”)。实例:将“mystyle”类添加到<div>元素: -
浏览器支持
项 IE/Edge Chrome FireFox Safari Opera 属性 classList 10.08.0+3.6+5.1+11.5+ -
语法
element.classList -
属性
属性 描述 length 返回列表中的类数。此属性是只读的 -
方法
方法 描述 add(class1, class2, ...) 向元素添加一个或多个类名。如果指定的类已存在,则不会添加该类 contains(class) 返回一个布尔值,指示元素是否具有指定的类名。可能的值: - true - 元素包含指定的类名
- false - 元素不包含指定的类名
item(index) 返回具有元素中指定索引号的类名。 索引从0开始。如果索引超出范围,则返回null remove(class1, class2, ...) 从元素中删除一个或多个类名。注意:删除不存在的类不会引发错误 toggle(class, true|false) 在元素的类名之间切换。第一个参数从元素中删除指定的类,并返回false。如果该类不存在,则将其添加到元素中,并且返回值为true。可选的第二个参数是一个布尔值,它强制添加或删除类,无论它是否已存在。 例如: - 删除一个类:element.classList.toggle(“classToRemove”,false);
- 添加一个类:element.classList.toggle(“classToAdd”,true);
注意:Internet Explorer或Opera 12及更早版本不支持第二个参数。 -
技术细节
项目 描述 返回值: DOMTokenList,包含元素的类名列表 DOM版本 Core Level 1 -
-