原生JS添加类名 删除类名

为 <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

兼容性:

原文地址:https://www.cnblogs.com/mmzuo-798/p/11046807.html

时间: 2024-11-07 09:43:22

原生JS添加类名 删除类名的相关文章

原生JS 添加或者删除某个class

$S.addHandler($S.getId(fav[i]),'mouseover',function(){                this.className += " "+'S_hover';            });            $S.addHandler($S.getId(fav[i]),'mouseout',function(){                var reg = new RegExp('(\\s|^)'+'S_hover'+'(\\s|

原生js添加class

function hasClass(obj, cls) { return obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)')); } function addClass(obj, cls) { if (!this.hasClass(obj, cls)) obj.className += " " + cls; } function removeClass(obj, cls) { if (hasClass(obj, cls

js添加确认删除操作注意事项

1 function delsure(){ 2 if(confirm('确认删除吗?')){ 3 return true;//点击确定则返回这里的内容 4 }else{ 5 return false; 6 } 7 } 在表单中添加onsubmit="return delsure(this)", confirm("确认删除吗?")如果点确定返回true,点取消返回false,必须要添加return true和return false,不然不起作用! js添加确认删除操

原生js添加节点的高级简便写法

insertAdjacentHTML()        原生js添加节点element.insertAdjacentHTML(position,text); var obj = document.getElementById("btn1"); obj.insertAdjacentHTML("afterEnd","<br><input name="txt1">"); 原文地址:https://www.cn

用JS添加和删除class类名

下面介绍一下如何给一个节点添加和删除class名 添加:节点.classList.add("类名"): 删除:节点.classList.remove("类名"): 以tab切换为例: 在写tab切换的时候,通常我们会给选中的tab设置不同的样式,常用的方法是给被选中的tab新增一个class名,然后改这个class名的样式. 比如 起一个class名叫“active” 设置样式 .active{ color: #FFD113 !important; } 在html代

原生JS添加节点方法与JQuery添加节点方法的比较及总结

一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="div2">div2 <span id="span1">span1</span> <span id="span2">span2</span> </div> <div id="div

JS 添加和删除HTML 标签

//添加一行价格 $('#add_ladder_price').click(function(){ var trHTML = '<tr align="center" class="tr_ladder_price">' + '<td><input style="text-align: center" type="text" name="purchases" value="

js给节点添加或删除类名

为 <div> 元素添加 class: document.getElementById("myDIV").classList.add("mystyle"); 为 <div> 元素添加多个类: document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass")

原生javascript添加和删除class

在操作class时,往往需要叠加或者删除一个class,这里用原生javascript写了一种方法,以供参考. 这里是html代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/19