原生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 相关文章推荐
打开超链需要“确认”对话框的方法
Mar 08 Javascript
按下回车键指向下一个位置的一个函数代码
Mar 10 Javascript
使用JavaScript和CSS实现文本隔行换色的方法
Nov 04 Javascript
灵活的理解JavaScript中的this指向
Feb 25 Javascript
ajax跨域调用webservice的实现代码
May 09 Javascript
jQuery实现右下角可缩放大小的层完整实例
Jun 20 Javascript
Html中 IFrame的用法及注意点
Dec 22 Javascript
令按钮悬浮在(手机)页面底部的实现方法
May 02 Javascript
vue-router路由懒加载和权限控制详解
Dec 13 Javascript
Angular使用动态加载组件方法实现Dialog的示例
May 11 Javascript
使用weixin-java-tools完成微信授权登录、微信支付的示例
Sep 26 Javascript
vue跳转方式(打开新页面)及传参操作示例
Jan 26 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
JAVA/JSP学习系列之七
2006/10/09 PHP
神盾加密解密教程(三)PHP 神盾解密工具
2014/06/08 PHP
php通过PHPExcel导入Excel表格到MySQL数据库的简单实例
2016/10/29 PHP
Yii框架页面渲染操作实例详解
2019/07/19 PHP
js constructor的实际作用分析
2011/11/15 Javascript
Jquery之Bind方法参数传递与接收的三种方法
2014/06/24 Javascript
jQuery中的编程范式详解
2014/12/15 Javascript
jQuery实现按键盘方向键翻页特效
2015/03/18 Javascript
javascript实现密码强度显示
2015/03/18 Javascript
js+div实现文字滚动和图片切换效果代码
2015/08/27 Javascript
Angularjs的ng-repeat中去除重复数据的方法
2016/08/05 Javascript
JS实现一个简单的日历
2017/02/22 Javascript
bootstrap suggest搜索建议插件使用详解
2017/03/25 Javascript
使用JavaScript实现在页面中显示距离2017年中秋节的天数
2017/09/26 Javascript
nodejs判断文件、文件夹是否存在及删除的方法
2017/11/10 NodeJs
浅谈angular表单提交中ng-submit的默认使用方法
2018/09/30 Javascript
js验证身份证号码记录的方法
2019/04/26 Javascript
详解js中let与var声明变量的区别
2020/04/05 Javascript
基于vue+axios+lrz.js微信端图片压缩上传方法
2019/06/25 Javascript
通过实例解析JavaScript for in及for of区别
2020/06/15 Javascript
python daemon守护进程实现
2016/08/27 Python
python实现简单图片物体标注工具
2019/03/18 Python
使用 Supervisor 监控 Python3 进程方式
2019/12/05 Python
纯css3实现的竖形无限级导航
2014/12/10 HTML / CSS
Canvas实现贝赛尔曲线轨迹动画的示例代码
2019/04/25 HTML / CSS
美国著名首饰网站:BaubleBar
2016/08/29 全球购物
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
医生进修自我鉴定
2014/01/19 职场文书
优秀公益广告词大全
2014/03/19 职场文书
法英专业大学生职业生涯规划书范文
2014/09/22 职场文书
出国签证在职证明范本
2014/11/24 职场文书
学生检讨书
2015/01/27 职场文书
家长会后的感想
2015/08/11 职场文书
初一英语教学反思
2016/02/15 职场文书
详解JavaScript的计时器和按钮效果设置
2022/02/18 Javascript
Django框架中视图的用法
2022/06/10 Python