原生javascript实现addClass,removeClass,hasClass函数


Posted in Javascript onFebruary 25, 2016

原生的addClass, removeClass, hasClass函数,未使用jquery

class.js

function hasClass(ele,cls) {
  return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}
 
function addClass(ele,cls) {
  if (!this.hasClass(ele,cls)) ele.className += " "+cls;
}
 
function removeClass(ele,cls) {
  if (hasClass(ele,cls)) {
    var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
    ele.className=ele.className.replace(reg,' ');
  }
}
 
//call the functions
addClass(document.getElementById("test"), "test");
removeClass(document.getElementById("test"), "test")
if(hasClass(document.getElementById("test"), "test")){//do something};
Javascript 相关文章推荐
限制文本框输入N个字符的js代码
May 13 Javascript
Javascript的一种模块模式
Sep 08 Javascript
JavaScript 图像动画的小demo
May 23 Javascript
javascript实现模拟时钟的方法
May 13 Javascript
简单封装js的dom查询实例代码
Jul 08 Javascript
Vue项目中quill-editor带样式编辑器的使用方法
Aug 08 Javascript
JS实现二维数组横纵列转置的方法
Apr 17 Javascript
解决angularjs前后端分离调用接口传递中文时中文乱码的问题
Aug 13 Javascript
ajax跨域访问遇到的问题及解决方案
May 23 Javascript
详解Vue之计算属性
Jun 20 Javascript
Element PageHeader页头的使用方法
Jul 26 Javascript
vue 实现element-ui中的加载中状态
Nov 11 Javascript
javascript随机抽取0-100之间不重复的10个数
Feb 25 #Javascript
JavaScript实现多种排序算法
Feb 24 #Javascript
JavaScript中的时间处理小结
Feb 24 #Javascript
JS设置cookie、读取cookie
Feb 24 #Javascript
jquery form表单获取内容以及绑定数据
Feb 24 #Javascript
javascript cookie的简单应用
Feb 24 #Javascript
javascript的正则匹配方法学习
Feb 24 #Javascript
You might like
真正面向对象编程:PHP5.01发布
2006/10/09 PHP
一个用于MySQL的PHP XML类
2006/10/09 PHP
PHP编码规范-php coding standard
2007/03/16 PHP
javascript编程起步(第三课)
2007/02/27 Javascript
JavaScript与C# Windows应用程序交互方法
2007/06/29 Javascript
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
JQuery的Validation插件中Remote验证的中文问题
2010/07/26 Javascript
Jquery 获取对象的几种方式介绍
2014/01/17 Javascript
jQuery手机浏览器中拖拽动作的艰难性分析
2015/02/04 Javascript
js+css实现有立体感的按钮式文字竖排菜单效果
2015/09/01 Javascript
基于JS实现数字+字母+中文的混合排序方法
2016/06/06 Javascript
js实现3D图片环展示效果
2017/03/09 Javascript
vue-cli+webpack在生成的项目中使用bootstrap实例代码
2017/05/26 Javascript
react-navigation 如何判断用户是否登录跳转到登录页的方法
2017/12/01 Javascript
你点的 ES6一些小技巧,请查收
2018/04/25 Javascript
浅谈layui里的上传控件问题
2019/09/26 Javascript
python抓取百度首页的方法
2015/05/19 Python
python类装饰器用法实例
2015/06/04 Python
尝试用最短的Python代码来实现服务器和代理服务器
2016/06/23 Python
对pandas的行列名更改与数据选择详解
2018/11/12 Python
ActiveMQ:使用Python访问ActiveMQ的方法
2019/01/30 Python
元组列表字典(莫烦python基础)
2019/04/03 Python
python实现的爬取电影下载链接功能示例
2019/08/26 Python
pandas的相关系数与协方差实例
2019/12/27 Python
pycharm实现在虚拟环境中引入别人的项目
2020/03/09 Python
python3发送request请求及查看返回结果实例
2020/04/30 Python
使用darknet框架的imagenet数据分类预训练操作
2020/07/07 Python
Python 如何实现数据库表结构同步
2020/09/29 Python
手机业务员岗位职责
2013/12/13 职场文书
道路建设实施方案
2014/03/18 职场文书
质量在我心中演讲稿
2014/09/02 职场文书
大学生个人简历自我评价
2015/03/11 职场文书
2016中秋节晚会开场白
2015/11/26 职场文书
火锅店的开业营销方案范本!
2019/07/05 职场文书
导游词之青岛太清宫
2019/12/13 职场文书
Python3中最常用的5种线程锁实例总结
2021/07/07 Python