<script>

        window.onload = function()

        {

            var oDiv = document.getElementById('div1');

            var oDiv2 = document.getElementById('div2');

            addClass(oDiv,'box1');

            removeClass(oDiv2,'box');

            function addClass(obj,className)

            {

                //如果原来没有Class

                if(obj.className == ''){

                    obj.className = className;

                } else{

                //如果原来有class

                    var arrClassName = obj.className.split(' ');

                    var _index = arrIndexOf(arrClassName,className);

                    if(_index == -1)

                    {

                        //如果要添加的class在原来的class中不存在

                        obj.className += ' ' + className;

                    }

                        //如果要添加的class在原来的class中存在

                }

            };

            function removeClass(obj,className)

            {

                //如果原来有class

                if(obj.className !='')

                {

                    var arrClassName = obj.className.split(' ');

                    var _index = arrIndexOf(arrClassName,className);

                    //如果有我要移除的class

                    if(_index != -1)

                    {

                        arrClassName.splice(_index,1);

                        obj.className = arrClassName.join(' ');

                    }

                }

                //如果原来没有class就什么都不做

            };

            function arrIndexOf(arr,v)

            {

                for(var i=0;i<arr.length;i++)

                {

                    if(arr[i] == v)

                    {

                        return i;

                    }

                }

                return -1;

            };

        };

</script>

<body>

    <div id="div1" class="box">aaaa</div>

    <div id="div2" class="box">bbb</div>

</body>

封装addClass 、 removeClass的更多相关文章

  1. 原生JavaScript实现的addclass,removeclass,hasclass,toggleclass,getbyclass

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  2. jQuery addClass removeClass toggleClass hasClass is(.class)用法

    jQuery addClass removeClass toggleClass hasClass is(.class)用法 <%@ page language="java" ...

  3. jQuery的addClass,removeClass和toggleClass方法

    jQuery的addClass,removeClass和toggleClass方法,最后一个方法在某一情形之下,可以替代前面2个方法. 第一个方法addClass为元素添加一个class. 第二个方法 ...

  4. jquery 对svg 元素的addClass removeClass 支持

    jquery 2.2 之后才支持对svg 元素的addClass removeClass

  5. JS封装addClass、removeClass

    addClass封装:1.先把原有的类名和需要添加的类名用“”切割.拼接. 2.查重,把所有类名遍历,重复的去掉. 3.“”拼接. function addClass(ele , cName) { v ...

  6. addClass, removeClass, toggleClass（从jquery中抠出来）

    <div id="d3" class="cur"></div> var mylibs = (function(){ var rtrim ...

  7. hasClass addClass removeClass

    //函数有class function hasClass(ele,cls){ return -1<(" "+ele.className+" ").inde ...

  8. 原生js实现addClass,removeClass,hasClass方法

    function hasClass(elem, cls) { cls = cls || ''; if (cls.replace(/\s/g, '').length == 0) return false ...

  9. ul li span addClass removeClass

    <link type="text/css" href="./style/css/base.css" rel="stylesheet"& ...

随机推荐

  1. Palindromic Squares

    链接 分析:求出b进制以后在判是否为回文 /* ID:wanghan PROB:palsquare LANG:C++ */ #include "iostream" #include ...

  2. 通用异步 Windows Socket TCP 客户端组件的设计与实现

    编写 Windows Socket TCP 客户端其实并不困难,Windows 提供了6种 I/O 通信模型供大家选择.但本座看过很多客户端程序都把 Socket 通信和业务逻辑混在一起,剪不断理还乱 ...

  3. 容器vector 迭代器iterator 应用

    #include <iostream> #include <vector> using namespace std; int main() { vector<int> ...

  4. java使用new Date()和System.currentTimeMillis()获取当前时间戳（转载）

    转自:http://www.cnblogs.com/wuchen/archive/2012/06/30/2570746.html 在开发过程中,通常很多人都习惯使用new Date()来获取当前时间, ...

  5. Ribbon整合Eureka，出现 No instances available for XXX 异常

    请观察这里的片段有没有问题? @Bean @LoadBalanced public RestTemplate restTemplate() { return new RestTemplate(); } ...

  6. Tasks 多核查找最大最小值问题

    先贴下代码 _Datas.ParallelForEach(arg_nDataStartIndex, arg_nDataCount, (data) => { dMax = dMax.Max(dat ...

  7. python 字符串操作二 内建函数

    一.查看字符串的内建函数 >>> dir(str) ['__add__', '__class__', '__contains__', '__delattr__', '__dir__' ...

  8. IDEA打开父类的接口方法快捷键

    有两个类,分别为A类是接口.B类为A的实现类. 如果想在B类里的某个方法,打开A类 可以鼠标右键点击这个方法名,按下键盘:Ctrl+U,就可以跳转到A类接口的该方法上面.

  9. 黑客攻防技术宝典web实战篇：Web 应用程序技术习题

    猫宁!!! 参考链接:http://www.ituring.com.cn/book/885 随书答案. 1. OPTIONS 方法有什么作用? OPTIONS 方法要求服务器报告可用于特定资源的 HT ...

  10. docker系列（一）：docker基础与安装笔记

    1 什么是docker docker是基于GO语言编写的开源容器项目,诞生于2013年初,到目前为止,已经经历了6年的发展演变.现如今,docker已经非常火爆,特别是在一线IT企业,部署.运维等工作 ...