原生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 相关文章推荐
监控 url fragment变化的js代码
Apr 19 Javascript
FF火狐下获取一个元素同类型的相邻元素实现代码
Dec 15 Javascript
自己使用js/jquery写的一个定制对话框控件
May 02 Javascript
jQuery 如何先创建、再修改、后添加DOM元素
May 20 Javascript
jQuery使用fadein方法实现渐出效果实例
Mar 27 Javascript
使用JavaScript实现旋转的彩圈特效
Jun 23 Javascript
javascript同步服务器时间和同步倒计时小技巧
Sep 24 Javascript
7个去伪存真的JavaScript面试题
Jan 07 Javascript
jquery常用的12个小功能
Jul 22 Javascript
基于BootStrap实现局部刷新分页实例代码
Aug 08 Javascript
pm2 部署 node的三种方法示例
Oct 20 Javascript
vant中的toast层级改变操作
Nov 04 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&amp;mysql(一)
2006/10/09 PHP
Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码
2010/04/07 PHP
php对象在内存中的存在形式分析
2015/02/03 PHP
php 利用socket发送HTTP请求(GET,POST)
2015/08/24 PHP
浅析PHP7的多进程及实例源码
2019/04/14 PHP
Prototype使用指南之ajax
2007/01/10 Javascript
保证JavaScript和Asp、Php等后端程序间传值编码统一
2009/04/17 Javascript
jquery实现兼容浏览器的图片上传本地预览功能
2013/10/14 Javascript
wap手机图片滑动切换特效无css3元素js脚本编写
2014/07/28 Javascript
使用jQuery.wechat构建微信WEB应用
2014/10/09 Javascript
基于javascript实现右下角浮动广告效果
2016/01/08 Javascript
JQuery ztree 异步加载实例讲解
2016/02/25 Javascript
JS解决iframe之间通信和自适应高度的问题
2016/08/24 Javascript
AngularJS自定义服务与fliter的混合使用
2016/11/24 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(放大缩小)
2016/12/02 Javascript
详解JS中的attribute属性
2017/04/25 Javascript
Angular2学习教程之组件中的DOM操作详解
2017/05/28 Javascript
vue2.0 + element UI 中 el-table 数据导出Excel的方法
2018/03/02 Javascript
jQuery实现左右两个列表框的内容相互移动功能示例
2019/01/27 jQuery
js仿淘宝放大镜效果
2020/12/28 Javascript
Python ORM框架SQLAlchemy学习笔记之映射类使用实例和Session会话介绍
2014/06/10 Python
python实现模拟按键,自动翻页看u17漫画
2015/03/17 Python
Python编程使用tkinter模块实现计算器软件完整代码示例
2017/11/29 Python
Django+JS 实现点击头像即可更改头像的方法示例
2018/12/26 Python
Python中and和or如何使用
2020/05/28 Python
Python操作Word批量生成合同的实现示例
2020/08/28 Python
Ibatis如何使用动态表名
2015/07/12 面试题
工业学校毕业生自荐书
2014/01/03 职场文书
元旦晚会上单位领导演讲稿
2014/01/05 职场文书
年度考核自我鉴定
2014/03/19 职场文书
党政领导班子四风问题对照检查材料思想汇报
2014/10/02 职场文书
教师辞职信范文
2015/02/28 职场文书
大学生敬老院活动总结
2015/05/07 职场文书
入党积极分子党小组意见
2015/06/02 职场文书
中秋晚会致辞
2015/07/31 职场文书
党员反邪教心得体会
2016/01/15 职场文书