zoukankan      html  css  js  c++  java
  • 原生js给div添加类

    一 写个函数然后传入对象元素跟样式名字,判定是否为空,如果不为空就赋值样式名字;

    function addclass(elm,newclass){
      var c = elm.className;
      if(c!="")
      elm.className=newclass;
    }

    二 写个函数然后传入对象元素跟需要添加到样式名字,判定是否为空,如果为空就赋值,否则就加个空格再赋值

    function addclass(elm,newclass){
      var c = elm.className;
      elm.className = (c =="") ? newclass : c+' '+newclass;
    }

    三 传入对象元素跟样式名字,然后把elm.className看成用“ ”(空格)分割的字符串,用split去除空格变成数组,然后用push方法添加样式到数组中,用join添加空格变成字符串再赋值给元素的class,很独特很棒的方法。

    function addclass(elm,newclass){ 
      var classes = elm.className.split(' '); 
      classes.push(newclass); 
      elm.className = classes.join(' '); 
    }

    然而,我觉得有点不足,假如元素本来就有newclass这类名,那怎么办?就像这样:
    <div class="div1 div2">
    然后我想添加个div2类给这个div,如果用第三种方法,虽然不会出错,但页面显示会变成这样<div class="div1 div2 div2">,于是我用第四种方法:

    四 继承第三种方法的优势,在其基础上做了个循环判定,保证没有重复的名字存在。

    function zhen(obj,claName){
      var cla=obj.className.split(" ");
      for(var i=0;i<cla.length;i++)
      {
        if(cla[i]==claName)
        return;
      }
      cla.push(claName);
      obj.className=cla.join(" ");
    }

    jquery添加类极易,一般工作用jquery添加,在此不赘述。

  • 相关阅读:
    STL函数对象和Lambda表达式
    STL算法之排序算法
    STL 算法
    STL源码剖析---根据最新版本的g++4.9.0(支持C++11)的修订(1)空间配置器
    STL Iterator的里里外外(一)?
    STL对比解说——关联容器
    Select单进程非阻塞TCP echo服务器
    TCP建立(3次握手)与终止(4次挥手)
    TIME_WAIT状态
    C标准I/O库
  • 原文地址:https://www.cnblogs.com/wu-hou/p/6375431.html
Copyright © 2011-2022 走看看