// 判断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. 2019新的开始,新的规划,庆祝CSDN访问量过千

    刚刚看了下博客访问量六千八百七十多个,然后我就自己刷新了一下,留个截图做纪念吧. 每一年都会有很多计划,然而到了年末却发现,未完成的还剩一大半,而完成的却屈指可数. 不过该立的flag还是要立的,顺便 ...

  2. 【转】jQuery - 同时添加click和dblclick事件

    特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...

  3. 排序算法(C++)

    冒泡排序.选择排序.快速排序.插入排序.希尔排序.归并排序.基数排序.堆排序. 推荐网址1:https://www.cnblogs.com/onepixel/articles/7674659.html ...

  4. Ruby的异常处理

    Ruby在处理0.1+0.2是会出现精度问题: 许多语言都有类似问题,详见网址:http://0.30000000000000004.com/ Ruby的异常处理 如果异常处理范围是整个方法体,可以省 ...

  5. Charles 功能介绍说明和使用教程

    https://juejin.im/post/5b8350b96fb9a019d9246c4c http://blog.devtang.com/2015/11/14/charles-introduct ...

  6. gcc编译错误

    使用boost的时候遇到一个链接错误 undefined reference to `boost::system::detail::generic_category_instance 出现这个问题的有 ...

  7. 一、基础篇--1.1Java基础-MVC设计思想

    MVC简介: MVC(Model View Controller) 是模型(model)-视图(view)-控制器(controller)的缩写.一种软件设计典范,用一种业务逻辑.数据.界面显示分离的 ...

  8. CondenseNet: An Efficient DenseNet using Learned Group Convolutions

    1. 摘要 作者提出了一个前所未有高效的新奇网络结构,称之为 CondenseNet,该结构结合了密集连接性和可学习的分组卷积模块. 密集连接性有利于网络中的特征复用,而可学习的分组卷积模块则可以移除 ...

  9. Socket上自定义协议总结

    TCP只是一个可靠传输的通信管道,上层协议要你自己定的,通俗来说就是发送方和接收方的约定 自定义协议的核心有两个:1. 控制码2. 流程控制 用Socket进行通信,发送的数据包一定是有结构的,类似于 ...

  10. Oracle 笔记(一)

    Oracle基本理论 l  主流数据库 微软公司:SQL Server  ACCESS IBM公司:DB2  infomix Oracle公司:Oracle  MySQL(AB公司) 小型数据库 AC ...