原生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 相关文章推荐
php实例分享之实现显示网站运行时间
May 20 Javascript
Backbone.js的一些使用技巧
Jul 01 Javascript
JavaScript实现的MD5算法完整实例
Feb 02 Javascript
Javascript将JSON日期格式化
Aug 23 Javascript
JS设置CSS样式的方式汇总
Jan 21 Javascript
js 性能优化之快速响应的用户界面
Feb 15 Javascript
从零开始学习Node.js系列教程之基于connect和express框架的多页面实现数学运算示例
Apr 13 Javascript
微信小程序 登录的简单实现
Apr 19 Javascript
Node.js中环境变量process.env的一些事详解
Oct 26 Javascript
vue 中滚动条始终定位在底部的方法
Sep 03 Javascript
通过vue-cli3构建一个SSR应用程序的方法
Sep 13 Javascript
jQuery实现鼠标拖动图片功能
Mar 04 jQuery
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 程序员也要学会使用“异常”
2009/06/16 PHP
使用PHP把HTML生成PDF文件的几个开源项目介绍
2014/11/17 PHP
php常用字符串比较函数实例汇总
2014/11/24 PHP
一个非常完美的读写ini格式的PHP配置类分享
2015/02/12 PHP
PHP面向对象程序设计__tostring()和__invoke()用法分析
2019/06/12 PHP
windows 2008r2+php5.6.28环境搭建详细过程
2019/06/18 PHP
js 获取Listbox选择的值的代码
2010/04/15 Javascript
jquery遍历数组与筛选数组的方法
2013/11/05 Javascript
鼠标滑在标题上显示图片的JS代码
2013/11/19 Javascript
jQuery之过滤元素操作小结
2013/11/30 Javascript
JS获取各种浏览器窗口大小的方法
2014/01/14 Javascript
js特殊字符过滤的示例代码
2014/03/05 Javascript
angularjs在ng-repeat中使用ng-model遇到的问题
2016/01/21 Javascript
实例教学如何写vue插件
2017/11/30 Javascript
jquery radio 动态控制选中失效问题的解决方法
2018/02/28 jQuery
微信小程序 下拉刷新及上拉加载原理解析
2019/11/06 Javascript
15分钟上手vue3.0(小结)
2020/05/20 Javascript
Python中的startswith和endswith函数使用实例
2014/08/25 Python
使用Python写CUDA程序的方法
2017/03/27 Python
python numpy 一维数组转变为多维数组的实例
2018/07/02 Python
Python3+selenium实现cookie免密登录的示例代码
2020/03/18 Python
基于pytorch中的Sequential用法说明
2020/06/24 Python
如何用Python 实现全连接神经网络(Multi-layer Perceptron)
2020/10/15 Python
使用CSS3配合IE滤镜实现渐变和投影的效果
2015/09/06 HTML / CSS
美国在线打印网站:Overnight Prints
2018/10/11 全球购物
学生感冒英文请假条
2014/02/04 职场文书
安全责任书模板
2014/07/22 职场文书
幼儿园大班个人总结
2015/02/28 职场文书
城管个人总结
2015/02/28 职场文书
小学重阳节活动总结
2015/03/24 职场文书
荒岛余生观后感
2015/06/09 职场文书
初任公务员培训心得体会
2016/01/08 职场文书
干货分享:推荐信写作技巧!
2019/06/21 职场文书
婚前协议书怎么写,才具有法律效力呢 ?
2019/06/28 职场文书
nginx反向代理时如何保持长连接
2021/03/31 Servers
深入理解以DEBUG方式线程的底层运行原理
2021/06/21 Java/Android