原生主要有三种方法:

1、className

var DomClass = document.getElementById("id").className;
//删除 pat
DomClass = DomClass.replace('pat',"");
document.getElementById("id").className = DomClass; //添加 pad
DomClass = DomClass.concat('pat');
document.getElementById("id").className = DomClass; //替换 pad
DomClass = DomClass.replace('pat',"pad");
document.getElementById("id").className = DomClass;

2、es5的classList

var DomClass = document.getElementById("id");
//删除 pat
DomClass.classList.remove("pat"); //添加 pad
DomClass.classList.add("pat");

3、同一 setAttribute

var DomClass = document.getElementById("id").getAttribute('class');
//删除 pat
DomClass = DomClass.replace('pat',"");
document.getElementById("id").setAttribute('class',DomClass); //添加 pad
DomClass = DomClass.concat('pat');
document.getElementById("id").setAttribute('class',DomClass); //替换 pad
DomClass = DomClass.replace('pat',"pad");
document.getElementById("id").setAttribute('class',DomClass);

@

js添加和删除class的更多相关文章

  1. 原生js添加和删除类

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

  2. 用JS添加和删除class类名

    下面介绍一下如何给一个节点添加和删除class名 添加:节点.classList.add("类名"): 删除:节点.classList.remove("类名") ...

  3. JS添加或删除HTML dom元素的方法实例分析

    本文实例讲述了JS代码添加或删除HTML dom元素的方法.分享给大家供大家参考,具体如下: 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一 ...

  4. 电力项目十七--数据字典首页JS添加和删除表格

    知识点:jQuery是一个JavaScript函数库. JS代码: function insertRows(){ //获取表格对象 var tb1 = $("#dictTbl"); ...

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

    function delsure(){ if(confirm('确认删除吗?')){ return true;//点击确定则返回这里的内容 }else{ return false; } } 在表单中添 ...

  6. js添加、删除Cookie

    //cookie function addCookie(objName, objValue, objHours) { //添加cookie var str = objName + "=&qu ...

  7. 04-THREE.JS 添加、删除物体,批量操作

    <!DOCTYPE html> <html> <head> <title></title> <script src="htt ...

  8. JS添加和删除表格行

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. 原生JS添加类名 删除类名

    为 <div> 元素添加 class: document.getElementById("myDIV").classList.add("mystyle&quo ...

随机推荐

  1. 最新版 IntelliJ IDEA2018.3.x 破解教程

    https://www.cnblogs.com/Candies/p/10050831.html

  2. thinkPHP中M()和D()的区别

    在实例化的过程中,经常使用D方法和M方法,这两个方法的区别在于M方法实例化模型无需用户为每个数据表定义模型类,如果D方法没有找到定义的模型类,则会自动调用M方法.通俗一点说:M实例化参数是数据库的表名 ...

  3. Classification

    kNN1 # -*- coding: utf-8 -*- """ kNN : 최근접 이웃 """ import numpy as np # ...

  4. Django搭建博客文章---模型层

    页面展示所需字段 1.文章标题---文本类型 2.文章摘要---文本类型 3.文章内容--文本类型 4.唯一的ID标记---int数字类型(自增.主键) 5.发布日期--日期类型 模型层定义字段 1. ...

  5. Cpp Generals 1.2

    原文链接https://www.cnblogs.com/zhouzhendong/p/Cpp-Generals.html 源码暂不公开 下载链接 适用系统: Windows: 运行时请在进入彩色界面之 ...

  6. 网络编程-Mysql-1、数据库的启动关闭,创建数据库,表等基本操作

    启动服务端:sudo service mysql start 关闭服务端:suodo service mysql stop 重启服务端:suodo service mysql restart 连接数据 ...

  7. iOS12系统应用发送邮件中的附件

    iOS12系统应用发送邮件中的附件 iOS12系统应用发送邮件中的附件,如果发送邮件的内容很多,或者包含文档.图片等,可以以附件的形式进行发送.此时需要使用addAttachmentData(_:mi ...

  8. 杭电1532----Drainage Ditches『最大流』

    /* 网络流的最大流问题 刚学习Dinic算法.模版题 */ #include <cstring> #include <cstdio> #include <queue&g ...

  9. Codeforces.1043F.Make It One(DP 容斥)

    题目链接 \(Description\) 给定\(n\)个数\(A_i\),求最少选出多少个数,使得它们的\(\gcd\)为\(1\). \(n,A_i\leq3\times10^5\). \(Sol ...

  10. Android系统源代码目录结构 “Android源代码”“目录结构”

    在讲述Android源码编译的三个步骤之前,将先介绍Android源码目录结构,以便读者理清Android编译系统核心代码在Android源代码的位置. Android源代码顶层目录结构如下所示: ├ ...