原生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 相关文章推荐
在jquery中处理带有命名空间的XML数据
Jun 13 Javascript
图片轮换效果实现代码(点击按钮停止执行)
Apr 12 Javascript
jquery中EasyUI使用技巧小结
Feb 10 Javascript
AngularJS入门教程之REST和定制服务详解
Aug 19 Javascript
Bootstrap表单控件使用方法详解
Jan 11 Javascript
通过构造函数实例化对象的方法
Jun 28 Javascript
angular 组件通信的几种实现方式
Jul 13 Javascript
jQuery UI实现动画效果代码分享
Aug 19 jQuery
vue-router权限控制(简单方式)
Oct 29 Javascript
Vue简单封装axios之解决post请求后端接收不到参数问题
Feb 16 Javascript
实现一个Vue自定义指令懒加载的方法示例
Jun 04 Javascript
javascript canvas实现简易时钟例子
Sep 05 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
自制短波长线天线频率预选器 - 成功消除B2K之流的镜像
2021/03/02 无线电
CodeIgniter使用phpcms模板引擎
2013/11/12 PHP
Yii2隐藏frontend/web和backend/web的方法
2015/12/12 PHP
PHP基于pdo的数据库操作类【可支持mysql、sqlserver及oracle】
2018/05/21 PHP
php微信公众号开发之校园图书馆
2018/10/20 PHP
Add a Table to a Word Document
2007/06/15 Javascript
IE和Firefox下event事件杂谈
2009/12/18 Javascript
juqery 学习之四 筛选查找
2010/11/30 Javascript
为JavaScript类型增加方法的实现代码(增加功能)
2011/12/29 Javascript
以WordPress为例讲解jQuery美化页面Title的方法
2016/05/23 Javascript
一个极为简单的requirejs实现方法
2016/10/20 Javascript
jQuery post数据至ashx实例详解
2016/11/18 Javascript
nodeJS模块简单用法示例
2018/04/21 NodeJs
微信小程序实现自定义picker选择器弹窗内容
2020/05/26 Javascript
[00:57]深扒TI7聊天轮盘语音出处5
2017/05/11 DOTA
[02:06]2018完美世界全国高校联赛秋季赛开始报名(附彩蛋)
2018/09/03 DOTA
Python基于numpy灵活定义神经网络结构的方法
2017/08/19 Python
python、java等哪一门编程语言适合人工智能?
2017/11/13 Python
Python时间戳使用和相互转换详解
2017/12/11 Python
python3 tkinter实现点击一个按钮跳出另一个窗口的方法
2019/06/13 Python
Python中面向对象你应该知道的一下知识
2019/07/10 Python
Python寻找路径和查找文件路径的示例
2019/07/10 Python
python使用原始套接字发送二层包(链路层帧)的方法
2019/07/22 Python
django认证系统实现自定义权限管理的方法
2019/08/28 Python
keras打印loss对权重的导数方式
2020/06/10 Python
Python加速程序运行的方法
2020/07/29 Python
谈谈对css属性box-sizing的了解
2017/01/04 HTML / CSS
阿里云:Aliyun.com
2017/02/15 全球购物
逃课上网检讨书
2014/02/20 职场文书
班主任班级寄语大全
2014/04/04 职场文书
党员个人查摆剖析材料
2014/10/16 职场文书
2015年艾滋病宣传活动总结
2015/03/27 职场文书
《吃水不忘挖井人》教学反思
2016/02/22 职场文书
2016年安康杯竞赛活动总结
2016/04/05 职场文书
使用Springboot实现健身房管理系统
2021/07/01 Java/Android
Spring Boot接口定义和全局异常统一处理
2022/04/20 Java/Android