classList 类数组

classList

        classList 属性返回元素的类名,作为 DOMTokenList 对象。

        该属性用于在元素中添加,移除及切换 CSS 类。

        classList 属性是只读的,但你可以使用 add() 和 remove() 方法修改它


        [ ]下标   元素的第几个class名字

        length   返回类列表中类的数量,该属性是只读的   var x = document.getElementById("myDIV").classList.length;

        value    className


add('name') 给元素添加一个或多个class

        document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass");


remove("name") 删除掉一个 class

        document.getElementById("myDIV").classList.remove("mystyle", "anotherClass", "thirdClass");


contains("name") 判断元素是否有这个class,返回布尔值    

        var x = document.getElementById("myDIV").classList.contains("mystyle");


toggle("name"); 切换 元素如果包含 "name" 这个class 就删除,否则就添加   

        document.getElementById("myDIV").classList.toggle("newClassName");


item(index) 返回元素中索引值对应的类名。索引值从 0 开始。如果索引值在区间范围外则返回 null

        var x = document.getElementById("myDIV").classList.item(0);


实例

var x = document.getElementById("myDIV");

查看元素是否存在 "mystyle" 类,如果存在则移除另外一个类名:

if (x.classList.contains("mystyle")) {

    x.classList.remove("anotherClass");

} else {

    alert("Could not find it.");

}


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值