原生主要有三种方法:

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. Gradle sync failed: SSL peer shut down incorrectly

    http://www.th7.cn/Program/Android/201604/817127.shtml 问题是在更新版本后出现的,被墙隔断的原因 引自大神解决方案 这个问题通常出现在Android ...

  2. sublime的插件

    记录一下常用的插件: 1. htmlpretty 用于HTML.CSS.JS的格式化,以方便阅读代码.插件全名是HTML-CSS-JS Pretty.安装后使用方法是: 打开一个HTML/CSS/JS ...

  3. 微信小程序--家庭记账本开发--01

    微信小程序的开发准备与开发工具的学习 在这次寒假伊始,临近春节,学习进程有所拉下,现在补上.寻找了好多网站的相关学习视频,包括微信公众平台关于小程序这方面也有好多相关资料供查阅. 1.开发准备: 首先 ...

  4. 使用ansible kubectl插件连接kubernetes pod以及实现原理

    ansible kubectl connection plugin ansible是目前业界非常火热的自动化运维工具.ansible可以通过ssh连接到目标机器上,从而完成指定的命令或者操作. 在ku ...

  5. mysql 使用教程 入门

    转载 http://www.cnblogs.com/mr-wid/archive/2013/05/09/3068229.html MySQL有三大类数据类型, 分别为数字.日期\时间.字符串, 这三大 ...

  6. BZOJ.4009.[HNOI2015]接水果(整体二分 扫描线)

    LOJ BZOJ 洛谷 又是一个三OJ rank1!=w= \(Description\) (还是感觉,为啥非要出那种题目背景啊=-=直接说不好么) 给定一棵树和一个路径集合(每条路径有一个权值).\ ...

  7. 根据文件大小自动判断单位B,KB,MB,GB

    <php> /** * 文件大小格式化 * @param integer $size 初始文件大小,单位为byte * @return array 格式化后的文件大小和单位数组,单位为by ...

  8. 复杂链表的复制(Hard)

    问题来源:选自LeetCode 138:复制带随机指针的链表 问题描述: 题目给定信息: 该链表中每一个节点的成员变量都有两个,一个是next指针指向该节点的下一个节点,一个是random指针指向不确 ...

  9. SSM的,日常错误

    org.springframework.beans.factory.BeanCreationException: Could not autowire field: private com.imooc ...

  10. oracle根据身份证号码 计算年龄、性别

    一.Oracle根据身份证判断性别: 女生身份证: 431382198103246985 男生身份证: 150921197208173492 SQL语句如下:   select decode(mod ...