内容来自百度搜索

//判断样式是否存在

function hasClass(ele, cls) {
    return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
}
//为指定的dom元素添加样式
function addClass(ele, cls) {
    if (!this.hasClass(ele, cls)) ele.className += " " + cls;
}
//删除指定dom元素的样式
function removeClass(ele, cls) {
    if (hasClass(ele, cls)) {
        var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
        ele.className = ele.className.replace(reg, " ");
    }
}
//如果存在(不存在),就删除(添加)一个样式
function toggleClass(ele,cls){ 
    if(hasClass(ele,cls)){ 
        removeClass(ele, cls); 
    }else{ 
        addClass(ele, cls); 
    
}
//调用
function toggleClassTest(){ 
    var ele = document. getElementsByTagName('body')[0]; 
    toggleClass(ele,"night-mode"); 

原生js实现删除class和添加class的更多相关文章

  1. 原生js怎么删除一个 div

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 【学习】原生js学习笔记1:添加class和使input为不可用

    <input type="checkbox" id="new_check" onChange="noUse()" checked> ...

  3. 原生js代码挑战之动态添加双色球

    var ballArr = []; //存放已有的红球,用来排除重复和排序window.onload = function(){ var btn = document.createElement(&q ...

  4. 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

    一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...

  5. jQuery和原生JS的对比

    原生JS的缺点: 不能添加多个入口函数(window.onload),如果添加了多个,后面的会把前面的覆盖掉 原生js的api名字太长,难以书写,不易记住 原生js有的代码冗余 原生js中的属性或者方 ...

  6. 原生js添加和删除类

    原生js添加和删除类: this.className +=" "; this.className = this.className.replace(" 原来的类" ...

  7. 原生JS动态添加和删除类

    原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...

  8. 分别使用原生js和jQuery添加/删除元素的class属性

    一.原生js添加/删除元素的class属性: <!-- span元素原有class = "test" --> <span class="test&quo ...

  9. 原生js实现类的添加和删除,以及对数据的add和update、view ,ajax请求 ,页面离开的操作

    1 类操作 function hasClass(cla, element) { if(element.className.trim().length === 0) return false; var ...

随机推荐

  1. [NOIP2017提高组]小凯的疑惑-扩展欧几里得

    #include<bits/stdc++.h> using namespace std; long long a,b,x,y,ans,tmp; inline void ex_gcd(lon ...

  2. 【原创】大数据基础之Impala(3)部分调优

    1)将coordinator和executor角色分离 By default, each host in the cluster that runs the impalad daemon can ac ...

  3. 关于 git 本地创建 SSH Key 遇到的一点问题(①file to save the key & ②the authenticity of host...)

    背景 由于想测试一下 SSH Key 创建的路径(.ssh 目录路径)对于不同位置 git 项目是否有效. 比如,.ssh 默认在 C:\[users]\[username] 目录下,而项目 proj ...

  4. 使用 Xtrabackup 部署 MySQL 从库

    数据库备份和恢复是数据库管理工作中非常重要的一个部分. 笔者常用的两个备份工具是mysqldump (逻辑备份)和 Xtrabackup (物理备份). 对于前者一般是用在凌晨的业务低峰期的定时任务中 ...

  5. Day05(fianl、抽象类、接口)

    final关键字修饰的类不能被继承.修改,修饰的方法不能被子类覆盖,修饰的变量(是常量)不能被修改. 抽象类:abstract关键字定义的类 继承树中越是在上方的类越抽象,在解决实际问题时,通常将父类 ...

  6. hibernate-第一章-基础

    一,简介 hibernate是一个开源的ORM框架,它对我们的jdbc进行了轻量级的对象封装,它将我们的POJO与数据库表简历映射关系,是一个全自动的ORM框架;hibernate可以自动生成SQL语 ...

  7. PHP获取服务器IP和客户端IP

    <?php echo '前端机IP:'.$_SERVER['REMOTE_ADDR']; echo '<br />'; echo '后端机IP:'.$_SERVER['SERVER_ ...

  8. 基于keil平台下STM32L系列移植FreeRTOS操作系统

    1,下载FreeRTOS https://www.freertos.org/a00104.html 点击下载后,会进入如下界面 之后会弹出下载界面,格式为.EXE,不用怀疑.不是木马. 等待下载完成, ...

  9. 使用rsync备份与同步文件

    在数字化时代的今天,随着个人拥有的数据量急剧增加,对其中的重要数据进行备份以保证其安全性.正确性变得越来越重要.同时,由于在公司.实验室.家里.外出等不同环境下往往使用不同的电脑设备(如台式机.笔记本 ...

  10. c/c++再学习:排序算法了解

    1.冒泡排序 冒泡排序是一种简单的排序算法.它重复地走访过要排序的数列,一次比较两个元素,如果它们的顺序错误就把它们交换过来.走访数列的工作是重复地进行直到没有再需要交换,也就是说该数列已经排序完成. ...