原生js封装添加class,删除class的实例


Posted in Javascript onNovember 06, 2017

一、添加class

function addClass(ele,cName) {
 var arr = ele.className.split(' ').concat(cName.split(" "));
 for(var i=0;i<arr.length;i++){
  for(var k=arr.length-1;k>i;k--){
   (arr[k]==="")&&arr.splice(k,1);
   (arr[i]===arr[k])&&arr.splice(k,1);
  }
 }
 ele.className = arr.join(" ");
}

二、删除class

function removeClass(ele,cName) {
 var arr1 = ele.className.split(' ');
 var arr2 = cName.split(" ");
 for(var i=0;i<arr2.length;i++)for(var j=arr1.length-1;j>=0;j--)(arr2[i]===arr1[j])&&arr1.splice(j,1)
 ele.className = arr1.join(" ")
}

其中还有一点空格的问题没有解决,如果你能学到一点东西,我会非常开心。

以上这篇原生js封装添加class,删除class的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
如何在标题栏显示框架内页面的标题
Feb 03 Javascript
FireFox与IE 下js兼容触发click事件的代码
Nov 20 Javascript
根据对象的某一属性进行排序的js代码(如:name,age)
Aug 10 Javascript
JQUERY设置IFRAME的SRC值的代码
Nov 30 Javascript
JavaScript File API文件上传预览
Feb 02 Javascript
Javascript表单特效之十大常用原理性样例代码大总结
Jul 12 Javascript
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 jQuery
原生js简单实现放大镜特效
May 16 Javascript
nginx配置React静态页面的方法教程
Nov 03 Javascript
angularjs获取到My97DatePicker选中的值方法
Oct 02 Javascript
JS散列表碰撞处理、开链法、HashTable散列示例
Feb 08 Javascript
JAVA面试题 static关键字详解
Jul 16 Javascript
Node.js实现发送邮件功能
Nov 06 #Javascript
快速搭建React的环境步骤详解
Nov 06 #Javascript
基于Two.js实现星球环绕动画效果的示例
Nov 06 #Javascript
two.js之实现动画效果示例
Nov 06 #Javascript
JS实现图片放大镜插件详解
Nov 06 #Javascript
js定时器实现倒计时效果
Nov 05 #Javascript
Vuejs实现购物车功能
Nov 05 #Javascript
You might like
PHP date函数参数详解
2006/11/27 PHP
一周学会PHP(视频)Http下载
2006/12/12 PHP
php 使用post,get的一种简洁方式
2010/04/25 PHP
eAccelerator的安装与使用详解
2013/06/13 PHP
深入Apache与Nginx的优缺点比较详解
2013/06/17 PHP
PHP管理依赖(dependency)关系工具 Composer的自动加载(autoload)
2014/08/18 PHP
PHP数组函数array_multisort()用法实例分析
2016/04/02 PHP
php常用日期时间函数实例小结
2019/07/04 PHP
ie下动态加态js文件的方法
2011/09/13 Javascript
js关于命名空间的函数实例
2015/02/05 Javascript
jquery UI Datepicker时间控件的使用方法(基础版)
2015/11/07 Javascript
Easyui的组合框的取值与赋值
2016/10/28 Javascript
jQuery实现两个select控件的互移操作
2016/12/22 Javascript
JavaScript递归算法生成树形菜单
2017/08/15 Javascript
详解nuxt sass全局变量(公共scss解决方案)
2018/06/27 Javascript
vue-cli的工程模板与构建工具详解
2018/09/27 Javascript
Vux+Axios拦截器增加loading的问题及实现方法
2018/11/08 Javascript
用element的upload组件实现多图片上传和压缩的示例代码
2019/02/12 Javascript
关于vue状态过渡transition不起作用的原因解决
2019/04/09 Javascript
十条建议帮你提高Python编程效率
2016/02/16 Python
Python基于回溯法子集树模板解决野人与传教士问题示例
2017/09/11 Python
Python数据拟合与广义线性回归算法学习
2017/12/22 Python
Python除法之传统除法、Floor除法及真除法实例详解
2019/05/23 Python
python求平均数、方差、中位数的例子
2019/08/22 Python
利用python Selenium实现自动登陆京东签到领金币功能
2019/10/31 Python
Python中zip函数如何使用
2020/06/04 Python
Python中如何添加自定义模块
2020/06/09 Python
python使用建议技巧分享(三)
2020/08/18 Python
Python页面加载的等待方式总结
2021/02/28 Python
运动会广播稿50字
2014/01/26 职场文书
银行党员批评与自我批评
2014/10/15 职场文书
2014年纪委工作总结
2014/12/05 职场文书
大队委员竞选演讲稿
2015/11/20 职场文书
《给予树》教学反思
2016/03/03 职场文书
Python保存并浏览用户的历史记录
2022/04/29 Python
阿里面试Nacos配置中心交互模型是push还是pull原理解析
2022/07/23 Java/Android