zoukankan      html  css  js  c++  java
  • jQuery 属性操作

    定义和用法:

    addClass() 方法向被选元素添加一个或多个类。

    该方法不会移除已存在的 class 属性,仅仅添加一个或多个 class 属性。

    提示:如需添加多个类,请使用空格分隔类名。

    语法:

         $(selector).addClass(class)

    参数class 是必需。规定一个或多个 class 名称。

    使用函数来添加类使用函数向被选元素添加类。

    语法:

    $(selector).addClass(function(index,oldclass))

    描述: 为每个匹配的元素添加指定的样式类名
    .addClass( className ),className为一个String字符串,为指定元素添加这个classname的类
    .addClass( function(index, currentClass) ),这个函数返回一个或更多用空格隔开的要增加的样式名。接收index 参数表示元素在匹配集合中的索引位置和html 参数表示元素上原来的 HTML 内容。在函数中this指向匹配元素集合中的当前元素。

    for example:

    源码中:

    //假设一天只有一条,就取第一条
     var dataItem=todayData[0];
     //可以判断数据情况,然后对日期上的日期进行处理
    //这里就把“异常”或者“巡检”数据的日期背景变成红色或者蓝色
     if (dataItem.flag==='异常') {
         $(day).addClass('abnormal-red');
       }
      else if (dataItem.flag==='巡检'){
         $(day).addClass('check-blue');
    }

    样式css文件中:

    /*异常数据日期改变样式红色 */
    .abnormal-red{
       background-color:red;
       color:white;
       width:20px;
       height:20px;
       border-radius:50%;
      overflow:hidden;
    }
    /*巡检数据日期改变样式蓝色 */
    .check-blue{
      background-color:#00A2E8;
      color:white;
      width:20px;
      height:20px;
      border-radius:50%;
      overflow:hidden;
    }

     结果展示:

    原来是这样的:(此法不行,因为在源码中嵌入了样式文件。上面的方法避免在源码中嵌入样式文件)

      //假设一天只有一条,就取第一条
       var m=d[0];
      //可以判断数据情况,然后对日期上的日期进行处理
      //这里就把“异常”或者“巡检”数据的日期背景变成红色或者蓝色
      if (m.flag==="异常") {
        $(day).css({'background-color':'red','color':'white','width':'20px','height':'20px', 'border-radius':'50%','overflow':'hidden'});
      }
       else if (m.flag==="巡检"){
         $(day).css({'background-color':'#00A2E8','color':'white','width':'20px','height':'20px', 'border-radius':'50%','overflow':'hidden'});
     }
  • 相关阅读:
    查看CentOS版本方法
    Android中string.xml文件中设置部分字体颜色大小
    linux重启oracle 各种方法
    Duilib初级控件扩展一例: 具有鼠标滚动消息的OptionUI
    VirtualBox 安装XP虚拟机需要注意的问题
    如何让VS2012编写的程序在XP下运行
    VC 系统托盘编程,含有气泡提示
    获取文件或是文件夹的大小和占用空间
    VC++实现获取文件占用空间大小的两种方法(非文件大小)
    VC++ 获取文件属性创建时间、修改时间和访问时间
  • 原文地址:https://www.cnblogs.com/shenxiaolin/p/6370118.html
Copyright © 2011-2022 走看看