//判断有没有class
hasClass(elements, cName) {
return !!elements.className.match(new RegExp("(\\s|^)" + cName + "(\\s|$)")); // ( \\s|^ ) 判断前面是否有空格 (\\s | $ )判断后面是否有空格 两个感叹号为转换为布尔值 以方便做判断
},
//移除class
removeClass(elements, cName) {
if (this.hasClass(elements, cName)) {
elements.className = elements.className.replace(new RegExp("(\\s|^)" + cName + "(\\s|$)"), " "); // replace方法是替换
}
},
//添加class
addClass(elements, cName) {
if (!this.hasClass(elements, cName)) {
elements.className += " " + cName;
}
},

浅析原生js模仿addclass和removeclass的更多相关文章

  1. 表单验证--通过原生js模仿ajax的异步交互

    今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...

  2. 原生JS实现addClass,removeClass,toggleClass

    jQuery操作class的方式非常强大,但是目前还有一些人不知道如何使用或者由于项目统一性的原因无法使用jquery. 在此写了一个利用原生js来实现对dom元素class的操作方法 1.addCl ...

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

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

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

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

  5. 用原生js模仿jquery

    阅读声明:本文档仅供学习,由于个人能力有限,文档中有错漏的地方还请指出,大家共同学习. 目前在学习怎么样写jquery,模仿阶段,有兴趣的同学可以和我一起学习,共同交流,在学习的路上希望有你做伴. 在 ...

  6. JS封装addClass、removeClass

    addClass封装:1.先把原有的类名和需要添加的类名用“”切割.拼接. 2.查重,把所有类名遍历,重复的去掉. 3.“”拼接. function addClass(ele , cName) { v ...

  7. 原生js模仿jq fadeIn fadeOut效果 兼容IE低版本

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

  8. 用原生JS模仿jquery,需要HTML5的支持

    jQuery是现在最流行的JavaScript工具库. 据统计,目前全世界57.3%的网站使用它.也就是说,10个网站里面,有6个使用jQuery.如果只考察使用工具库的网站,这个比例就会上升到惊人的 ...

  9. 原生js模仿下拉刷新功能

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

随机推荐

  1. scala sortBy and sortWith

    sortBy: sortBy[B](f: (A) ⇒ B)(implicit ord: math.Ordering[B]): List[A] 按照应用函数f之后产生的元素进行排序 sorted: so ...

  2. .NET 同步与异步之锁(ReaderWriterLockSlim)(八)

    本随笔续接:.NET 同步与异步之锁(Lock.Monitor)(七) 由于锁 ( lock 和 Monitor ) 是线程独占式访问的,所以其对性能的影响还是蛮大的,那有没有一种方式可是实现:允许多 ...

  3. WCF兼容WebAPI输出Json格式数据,从此WCF一举两得

    问题起源: 很多时候为了业务层调用(后台代码),一些公共服务就独立成了WCF,使用起来非常方便,添加服务引用,然后简单配置就可以调用了. 如果这个时候Web站点页面需要调用怎么办呢? 复杂的XML , ...

  4. Djnogo Web开发学习笔记(2)

    安   装 截止目前,https://www.djangoproject.com/download/提供的最新的Django的下载版本为1.6.4. Install Django You’ve got ...

  5. Linux 下查看局域网内所有主机IP和MAC

    linux环境下,执行namp对局域网扫描一遍,然后查看arp缓存表就可以知道局域内ip对应的mac.namp比较强大也可以直接扫描mac地址和端口,执行扫描之后就可以在/proc/net/arp查看 ...

  6. [k8s]nginx-ingress配置4/7层测试

    基本原理 default-backend提供了2个功能: 1. 404报错页面 2. healthz页面 # Any image is permissable as long as: # 1. It ...

  7. JAVA(三)JAVA常用类库/JAVA IO

    成鹏致远 | lcw.cnblog.com |2014-02-01 JAVA常用类库 1.StringBuffer StringBuffer是使用缓冲区的,本身也是操作字符串的,但是与String类不 ...

  8. 一键解包/打包boot.img/recovery.img工具(高通/MTK双版 支持android 5.1以上)

    下载地址: 链接: https://pan.baidu.com/s/1hsA2oWc 密码: skdx

  9. not in 的优化

    //---------------------- 建表1 ---------------------- create table TESTTABLE( id1 VARCHAR2(12), name V ...

  10. Xcode6: CocoaPods 错误 target overrides the `OTHER_LDFLAGS`...

    CocoaPods 错误 target overrides the `OTHER_LDFLAGS`... Xcode 升级到 6.0 后,更新 CocoaPods,出现了如下的警告 [!] The ` ...