通过js添加class名的三种方式

作者: locky丶 | 来源:发表于2020-06-18 16:35 被阅读0次

我们在做网页交互时经常要改变dom上的样式，这里总结下三种我常用的方式。
我们先定义一个class

<style>
.active{
  color: #ffddcc;
}
</style>

1. 使用setAttribute()

let div1 = document.getElementById('div1')
div1.setAttribute('class', 'active')

浏览器兼容性： ie8 及以上

2. classList

let div2 = document.getElementById('div2')
div2.classList.add('active')

浏览器兼容性： ie10 及以上

let div3 = document.getElementById('div3')
div3.className('active')

浏览器兼容性：全兼容

通过js添加class名的三种方式
我们在做网页交互时经常要改变dom上的样式，这里总结下三种我常用的方式。我们先定义一个class 1. 使用set...
反射
反射 class 获取class字节码对象的三种方式： //1、通过类.class Class cla...
常用 v-bind动态绑定class(对象语法)
1.用法：通过布尔值决定是否将该类名添加到class上背景：通过判断给class添加类名，动态改变元素的样式。...
反射
反射必须依赖Class类字节码文件获取Class对象三种方式1.类名.class String.class...
获取Class对象的方式
三种获取Class对象的方式 1 通过对象的getClass()方法 2 通过字节码文件获取 3、通过Class类...
2018-08-30
JS引入方式在元素的时间中添加js代码通过Script标签添加js代码 alert("第二种引入方式"); 写...
Java 反射实例
反射获取 Class类的对象有三种方式：Object类中的getClass()方法类.class通过Class类的...
原生js操作DOM元素的一些使用
1、原生js给DOM元素添加一个类名方法一：使用DOM.setAttribute("class","类名") ...
反射
获取class的三种方式 1、根据对象获取对象.getClass 2、根据类获取类名.class 3、根据全类...
input 输入校验
方式一：通过添加@input事件 inputValid.js 使用方式1、在main.js中，将inputVali...

本文标题：通过js添加class名的三种方式

本文链接：https://www.haomeiwen.com/subject/jibuxktx.html