// 判断class有无
function hasClass(ele, cls) {
if (ele) {
cls = cls || ''
if (cls.replace(/\s/g, '').length == 0) return false // 当cls没有参数时,返回false
return new RegExp(' ' + cls + ' ').test(' ' + ele.className + ' ')
}
}
// 添加class
function addClass(ele, cls) {
if (!hasClass(ele, cls) && ele) {
ele.className = ele.className == '' ? cls : ele.className + ' ' + cls
}
}
// 去除class
function removeClass(ele, cls) {
if (hasClass(ele, cls) && ele) {
var newClass = ' ' + ele.className.replace(/[\t\r\n]/g, '') + ' ';
while (newClass.indexOf(' ' + cls + ' ') >= 0) {
newClass = newClass.replace(' ' + cls + ' ', ' ');
}
ele.className = newClass.replace(/^\s+|\s+$/g, '');
}
}

JS实现hasClass addClass removeClass的更多相关文章

  1. hasClass addClass removeClass

    //函数有class function hasClass(ele,cls){ return -1<(" "+ele.className+" ").inde ...

  2. 原生js 实现jquery addClass,removeClass

    代码如下: function hasClass(obj, cls) { let reg = new RegExp("(\\s|^)" + cls + "(\\s|$)&q ...

  3. jQuery addClass removeClass toggleClass hasClass is(.class)用法

    jQuery addClass removeClass toggleClass hasClass is(.class)用法 <%@ page language="java" ...

  4. 原生JavaScript实现的addclass,removeclass,hasclass,toggleclass,getbyclass

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. jQuery的addClass,removeClass和toggleClass方法

    jQuery的addClass,removeClass和toggleClass方法,最后一个方法在某一情形之下,可以替代前面2个方法. 第一个方法addClass为元素添加一个class. 第二个方法 ...

  6. jquery 对svg 元素的addClass removeClass 支持

    jquery 2.2 之后才支持对svg 元素的addClass removeClass

  7. 原生js 用正则实现removeclass hasclass getsclass addclass .

    function getByClass(oParent,sClass){ if(oParent.getElementsByClassName){ return oParent.getElementsB ...

  8. 原生js实现addClass,removeClass,hasClass方法

    function hasClass(elem, cls) { cls = cls || ''; if (cls.replace(/\s/g, '').length == 0) return false ...

  9. html5的classList属性介绍和原生js实现jQuery的addClass,removeClass,hasClass方法

    其实html5已经扩展了class操作的相关API,其中classList属性就以及实现了class的增删和判断. classList属性的方法有: add(value) 添加类名,如果有则不添加 c ...

随机推荐

  1. win7环境下mongodb分片和移除

    本文主要介绍在一台win7电脑上模拟mongo分片.如果有多台服务器,可以将每个mongo部署在单台电脑上.我们将配置3个mongo分片,3个配置服务器,1个路由服务器.如下图所示进行配置,介绍如何增 ...

  2. jQuery .submit()

    .submit() Events > Form Events | Forms .submit( handler )Returns: jQuery Description: Bind an eve ...

  3. 数字 kotlin (1)

    数字Kotlin 处理数字在某种程度上接近 Java,但是并不完全相同.例如,对于数字没有隐式拓宽转换(如 Java 中 int 可以隐式转换为 long ——译者注),另外有些情况的字面值略有不同. ...

  4. android 注入框架 DI

    android 主要注入框架以及github如下: (1)Roboguice https://github.com/roboguice/roboguice (2)Butterknife https:/ ...

  5. css(float浮动和clear清除)

    教程开始: 首先要知道,div是块级元素,在页面中独占一行,自上而下排列,也就是传说中的流.如下图: 可以看出,即使div1的宽度很小,页面中一行可以容下div1和div2,div2也不会排在div1 ...

  6. python-静态方法和类方法及其使用场景

    静态方法和类方法 静态方法 我们在类中定义的方法都是对象方法,也就是说这些方法都是发送给对象的消息.实际上,我们写在类中的方法并不需要都是对象方法,例如我们定义一个"三角形"类,通 ...

  7. flutter Waiting for another flutter command to release the startup lock…

    flutter安装完成后执行flutter doctor ,一直提示如下: Waiting for another flutter command to release the startup loc ...

  8. 关于Toad的Cannot load OCI DLL问题

    昨天重新安装了新版本的JDK,突然发现Toad连接的时候报Cannot load OCI DLL....问题,网上查找了多种方法均不见效. 后调整系统环境变量配置,还原了之前安装的JDK版本,问题修复 ...

  9. python学习笔记:(十四)面向对象

    1.类(class): 用来描述具有相同的属性和方法的对象的集合.它定义了该集合中每个对象所共有的属性和方法 2.类变量: 类变量在整个实例化的对象中是公用的.类变量定义在类中且在函数体之外.类变量通 ...

  10. Java学习之==>注解

    一.概述 关于注解,首先引入官方文档的一句话:Java 注解用于为 Java 代码提供元数据.作为元数据,注解不直接影响你的代码执行,但也有一些类型的注解实际上可以用于这一目的.接下我将从注解的定义. ...