元素class的增、删、查、toggle

比如有一个元素div

<div class="btn user">我是div</div>

之前只知道元素有一个className可以来改动  元素的类名

但是今天看到了,HTML5,增加了classList属性,更改元素的类名会更简单

先获取到这个div元素

var div=document.querySelector('.btn');

classList有4个方法 add()   contains()   remove()  toggle()

想必大家看到这些方法名就能猜到这些方法是干什么的

add()    增加类名(存在就不再增加了)

contains()   检查这个类名存在不存在     存在返回true   不存在返回 false

remove()     删除指定类名   

toggle()     类名存在就删除     不存在就添加

插入个实例代码 

var div=document.querySelector('.btn');
    console.log(div)
    div.classList.add('haah')
    console.log(div.classList.contains('haah'));
    div.classList.remove('haah');
    div.classList.toggle('haah')
    var classs=div.classList;
    console.log(classs)

 

posted @ 2019-01-19 16:18  古墩古墩  Views(219)  Comments(0Edit  收藏  举报