原生JS添加类名删除类名

最新推荐文章于 2022-06-20 14:52:56 发布

小瑾沐晚风

最新推荐文章于 2022-06-20 14:52:56 发布

阅读量1.7k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/xiaojinguniang/article/details/100540584

版权

13 篇文章 6 订阅

订阅专栏

为 <div> 元素添加 class:

document.getElementById("myDIV").classList.add("mystyle");

为 <div> 元素添加多个类:

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

为 <div> 元素移除一个类:

document.getElementById("myDIV").classList.remove("mystyle");

为 <div> 元素移除多个类:

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

检查是否含有某个CSS类

myDiv.classList.contains('myCssClass'); //return true or false

检查页面是否包含某个元素

if(document.getElementById("p1")) {
    console.log("p1存在");
} else {
    console.log("p1不存在");
}

注意：

在使用jquery时，判断页面是否包含某个元素，应该使用下面写法：

if($("#p11").length > 0) {
    console.log("p1存在");
} else {
    console.log("p1不存在");
}

而不是：

if($("#p11")) {
    console.log("p1存在");
} else {
    console.log("p1不存在");
}

如果使用后面的写法，无论页面是否包含id为p11的元素，都打印“p1存在”。

原因：$("#p11")是一个对象，数据类型为object。

当页面存在这个元素时，打印结果如下

当页面元素不存在时，打印结果如下：

关注