• 技术文档
  • 专业的网站建设公司
  • 020-39182790

技术文档

您现在的位置:首页 > 服务支持 > 技术文档
JS之给元素添加类的方法
作者:织晶客服部 发布于:2020/7/22 12:04:06 点击量: 来源:织晶网络

JS之给元素添加类的方法, 来自jessie-xian。原生js中添加类的方法,为div元素添加一个类,为div元素添加多个类,为div元素移除一个类, 为div元素移除多个类;jquery中添加类的方法;检查是否含有某个类的方法; 覆盖原来的样式;追加样式不覆盖原来的样式;仅供大家参考。


原生js中添加类的方法
//1.为元素添加一个类:

document.getElementById("div").classList.add("类名");


//2.为元素添加多个类:

document.getElementById("div").classList.add("类名1","类名2","类名3",...);


//3.为元素移除一个类:

document.getElementById("div").classList.remove("类名");


//4.为元素移除多个类: document.getElementById("div").classList.remove("类名1","类名2","类名3",...);

.jquery中添加类的方法
//1.为元素添加一个类: $("#div").addClass("类名");

//2.为元素添加多个类:

//只需要通过空格来间隔 class 值即可一次性添加多个 class
 $("#div").addClass("类名1 类名2 类名3");

//3.为元素移除一个类:

$("#div").removeClass("类名");
//4.为元素移除多个类:

-----------------------------------------------------------------------------------

检查是否含有某个类的方法:
//检查是否含有某个CSS类
div.classList.contains('类名'); //return true or false
-------------------------------------------------------------------------------------
// 覆盖原来的样式
document.getElementById("test").setAttribute("class","test1");
var dom=document.getElementsByClassName("test")[0].setAttribute("class","test1");

// 追加样式不覆盖原来的样式
document.getElementById("test").classList.add("test1");
document.getElementById("test").classList.add("test1","test2","test3");
var dom=document.getElementsByClassName("test")[0].classList.add("test1");
var dom=document.getElementsByClassName("test")[0].classList.add("test1","test2","test3");



上一篇:网站安全策略是什么?

下一篇:Node.js特点与应用场景