用原生js实现addClass,removeClass,hasClass方法
来源:互联网 发布:从程序员到架构师 pdf 编辑:程序博客网 时间:2024/05/18 10:37
其实html5已经扩展了class操作的相关API,其中classList属性就以及实现了class的增删和判断。
classList属性的方法有:
- add(value) 添加类名,如果有则不添加
- contains(value) 判断是否存在类名,返回Boolean值
- remove(value) 从列表中删除类名
- toggle(value) 切换类名:如果列表中存在则删除,否则添加
根据红宝书的介绍,目前支持classList属性的浏览器有FireFox 3.6+和Chrome。因此为了更好的兼容性,我们可以自己手动实现这几个方法。
这里利用了DOM属性 className,我们始终是在操作这个对象。
function hasClass( elements,cName ){ return !!elements.className.match( new RegExp( "(\\s|^)" + cName + "(\\s|$)") ); }; function addClass( elements,cName ){ if( !hasClass( elements,cName ) ){ elements.className += " " + cName; }; }; function removeClass( elements,cName ){ if( hasClass( elements,cName ) ){ elements.className = elements.className.replace( new RegExp( "(\\s|^)" + cName + "(\\s|$)" ), " " ); }; };
0 0
- 原生js实现addClass,removeClass,hasClass方法
- 用原生js实现addClass,removeClass,hasClass方法
- 原生JS addClass removeClass hasClass
- 仿jQuery原生js实现----hasClass,removeClass,addClass
- js原生扩展addClass,removeClass,hasClass
- 原生js封装addClass removeClass hasClass
- JS原生addClass、removeClass实现
- 使用原生JS实现jQuery的addClass, removeClass, hasClass函数功能
- 使用原生JS实现jQuery的addClass, removeClass, hasClass函数功能
- jquery hasClass、removeClass、addClass方法
- JS实现jQuery的addClass, removeClass, hasClass函数功能
- 原生JS实现addClass,removeClass,toggleClass
- 原生JS实现addClass,removeClass,toggleClass
- 原生js实现addClass、removeClass、toggleClass
- 原生js 实现addclass和removeclass
- 原生JS实现addClass,removeClass,toggleClass
- 关于JavaScript的addClass,removeClass,hasClass方法
- jquery hasClass/addClass/removeClass
- 谈对C语言中内存分配的理解
- 按键控制数码管0-99显示,十位不跳,用定时器T0中断
- 体系结构—批处理风格
- 货运公司的交货方式有哪些呢?
- 算法作业12
- 用原生js实现addClass,removeClass,hasClass方法
- Linux (1) : 基础介绍
- JavaScript UI框架jQWidgets更新至v4.5.1丨附下载
- [Bartender]Bartender条形码制作软件如何实现左侧自动补零
- Oracle数据库下 查询那张表被锁定 被谁锁定
- 生成服务端推送证书
- Libgdx使用ShapeRenderer自定义Actor,无法接收到Touch事件
- Java基本类型占用的字节数(char占用几个字节问题)
- cnn介绍