1、addClass:为指定的dom元素添加样式。

2、removeClass:删除指定dom元素的样式。

3、toggleClass:如果存在(不存在),就删除(添加)一个样式。

4、hasClass:判断样式是否存在。

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)) {
var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
obj.className = obj.className.replace(reg, ' ');
}
} function toggleClass(obj,cls){
if(hasClass(obj,cls)){
removeClass(obj, cls);
} else {
addClass(obj, cls);
}
}

原生js实现元素类名的判存、添加和移除的更多相关文章

  1. 原生js获取元素的样式信息

    工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...

  2. 原生js获取元素样式

    摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...

  3. 原生JS获取元素宽高实践详解

    开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...

  4. JavaScript DOM查询,原生js实现元素子节点的获取

    在网页网页开发中,经常会需要获取某个网页元素的子元素,然后对其进行事件绑定.或样式修改等行为.这些操作对于jquery来说很容易,但是对于原生js会稍微麻烦一些,这里将介绍四种方法获取元素的子元素(本 ...

  5. 原生js怎么为动态生成的标签添加各种事件

    这几天用zepto.js写了不少事件,突然想到一个问题,那就是原生的js如何给动态生成的标签添加事件?因为这些标签都是后来通过ajax或者运行其他点击事件生成的,那么如果之前给他们写事件他们这个dom ...

  6. 原生JS查找元素

    今天写了一个很简单.很粗暴的通过JS根据类来查找DOM元素. 为了降低它的粗暴等级(耗费性能)我给了三个等级. 首先性能最好的,适合FF,CH,IE8,通过querySelectorAll这个API. ...

  7. 原生JS获取元素集合的子元素宽度

    有些时候,在一个网页的ul li中,存在左右两个部分的内容,但是右边元素内容又是不固定,左边元素相对应的不能用固定宽度,所有需要我们动态的获取右边元素宽度,来赋值给左边元素的marginRight值. ...

  8. 原生js获取元素的子元素

    //使用firstChild //但是下面这种因为有空格,也算其子元素 <lable> <span id="onlinePerson" name="pe ...

  9. 原生js获取元素非行内样式属性的方法

    获取当前对象的样式DOM标准中的全局方法 getComputedStyle(obj).width (获取元素的宽度),但在非标准IE浏览器(IE8)以下有兼容问题IE8以下要这样写 obj.curre ...

随机推荐

  1. div不换行的三种方法

    原文:https://www.cnblogs.com/zouwangblog/p/11149621.html float <div class="div1">123&l ...

  2. Django--一对多表操作

    目录 Django--一对多表操作 需求 步骤 添加路由映射关系 学生表的增删改查 ajax更新和添加 Django--一对多表操作 今天还以一个学生管理系统为例,先通过pymysql这个模块,进行一 ...

  3. centos7 下gcc离线安装

    1.在centos安装镜像文件ios中的Packages文件夹中需找安装文件: 把需要的文件直接复制出来就行. 这里提醒的一点是,如果用命令行进入该文件夹,因为文件路径带空格,所以需要加上双引号: [ ...

  4. 32、flex布局

    html: <div class="parent"> <div class="son">1</div> <div cl ...

  5. 英语chalchite蓝绿松石chalchite单词

    蓝绿松石是铜和铝的磷酸盐矿物集合体,以不透明的蔚蓝色最具特色.也有淡蓝.蓝绿.绿.浅绿.黄绿.灰绿.苍白色等色.一般硬度5~6,密度2.6~2.9,折射率约1.62.长波紫外光下,可发淡绿到蓝色的荧光 ...

  6. xenserver 备份和还原

    1. 备份和还原xenserver host系统 //备份 # xe host-backup file-name=[name.xbk] -s [ip] -u [username] -pw [passw ...

  7. Omapl138中AIS文件分析(参照Using the OMAP-L138 Bootloader)(转)

    Omapl138中AIS文件分析(参照Using the OMAP-L138 Bootloader) 转载链接:https://blog.csdn.net/qq_40788950/article/de ...

  8. 【转】如何把变量或者数组定义到SDRAM及任意位置

    我们开发软件的时候,经常会遇到到一个问题,就是内存不够,这个时候就纠结了,怎么办,有两种方法,第一种是扩展内存,外加SRAM或者SDRAM:第二种应该就是优化代码,也就是通常所说的把数组大小减一减,代 ...

  9. Redis SCAN命令实现有限保证的原理

    SCAN命令可以为用户保证:从完整遍历开始直到完整遍历结束期间,一直存在于数据集内的所有元素都会被完整遍历返回,但是同一个元素可能会被返回多次.如果一个元素是在迭代过程中被添加到数据集的,又或者是在迭 ...

  10. Linux 环境变量配置错误,导致所有命令找不到

    今天配置环境变量,PATH设置出错,所有的命令都找不到了,提示说在/usr/bin/下面可以找到,但是cd过去以后还是不行,自己也在其他路径上找了,还是没找到 而且是公司开发机,怕耽误事儿,着实吓了一 ...