我们常常要使用Javascript来改变页面元素的样式。其中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们通常是通过处理HTML Dom的classname特性来实现的;而jQuery里提供三种方法来实现这个功能,虽然它们和传统方法的思想相通,但是却节省了许多代码。还是那句话 - “jQuery让JavaScript代码变得简洁!”

1. addClass() - 添加CSS类

$("#target").addClass("newClass");
//#target 指的是需要添加样式的元素的ID
//newClass 指的是CSS类的名称

2. removeClass() - 移除CSS类

$("#target").removeClass("oldClass");
//#target 指的是需要移除CSS类的元素的ID
//oldClass 指的是CSS类的名称

3. toggleClass() - 添加或者移除CSS类:如果CSS类已经存在,它将被移除;相反,如果CSS类不存在,它将被加上。

$("#target").toggleClass("newClass")
//如果ID为“target”的元素已经定义了CSS样式,它将被移除;
//反之,CSS类”newClass“将被赋给该ID。

在实际运用中,我们常常先定义好这些CSS类,然后通过Javascript事件触发(比如点击某个链接)来改变页面元素样式。此外,jQuery还提供一种方法 hasClass("className")用来判断某个元素是否已经被赋予某个CSS类。

常见问题:

<label for="TrueName" generated="true" class="msg-error" style="">正确</label>

通过addClass("msg-success");

<label for="TrueName" generated="true" class="msg-error msg-success" style="">正确</label>

JQ添加移除css样式--转载 心存善念的更多相关文章

  1. JQ添加移除css样式

    1. addClass() - 添加CSS类 $("#target").addClass("newClass"); //#target 指的是需要添加样式的元素 ...

  2. 如何添加/移除CSS类

    在网页设计中,我们常常要使用Javascript来改变页面元素的样式.其中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们通常是通过处理HTML Dom的clas ...

  3. jQuery动态追加移除CSS样式

    jQuery基础知识,动态添加删除CSS样式 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  4. jQuery 动态添加、删除css样式

    1.addClass css中: <style type="text/css">       .chColor {background: #267cb7;color:w ...

  5. TP5.1 分页CSS样式(转载)

    效果如图: 1.在extend\目录下创建page目录,在page目录中创建Page.php文件,将以下代码放入文件中 <?php namespace page; use think\Pagin ...

  6. jquery 给指定li添加制定的css样式

    $("ul li").eq(1).css({"color":"red"}); //第二个li $("ul li").eq ...

  7. jq修改多个css样式

    $("#xxx").css({"属性名称": "属性值", "属性名称": "属性值" });

  8. salesforce linghtning component 自动添加标准style css样式

    Your app automatically gets Lightning Design System styles if it extends  force:slds <aura:applic ...

  9. jQuery动态添加删除CSS样式

    jQuery框架提供了两个CSS样式操作方法,一个是追加样式addClass,一个是移除样式removeClass,下面通过一个小例子讲解用法. jQuery动态追加移除CSS样式 <!DOCT ...

随机推荐

  1. wp8.1 Study8:页面过渡和主题动画(Page transition and Theme animations)

    一.在WP8.1中是有动画(Animation)的: 页面导航(默认为旋转式Turnstile).PointerDown/up(默认是倾斜).页面旋转.MenuFlyout出现等等 二.页面过渡(Pa ...

  2. jpcap

    1.System.out.println( System.getProperty("java.library.path")); 2.将jpcap.dll放到上边打印的路径中

  3. 在VS中使用类模板出现出现LNK2019: 无法解析的外部符号错误。

    在VS中使用类模板出现出现LNK2019: 无法解析的外部符号错误,应在一个.h文件中完成方法的声明与实现,不要将实现放在cpp文件里,VS貌似不支持类模板分离

  4. VMware-workstation-full-10.0.3-1895310 CN

    Name: VMware-workstation-full-10.0.3-1895310.exe发行日期: 2014-07-01内部版本号: 1895310文件大小: 491 MB文件类型: exe ...

  5. 发布Restful服务时出现IIS 指定了身份验证方案错误时的解决方案(IIS specified authentication schemes)

    发布RESTful服务,当访问.svc文件时出现如下错误时: IIS 指定了身份验证方案“IntegratedWindowsAuthentication, Anonymous”,但绑定仅支持一种身份验 ...

  6. 红帽中出现”This system is not registered with RHN”的解决方案

    原因是你的linux没有在红帽网络上注册,所以无法下载上面的软件包,替代方案可以使用centos. 下面介绍下使用centos 的流程 1.卸载rhel的默认安装的yum包查看yum包rpm -qa| ...

  7. 《foreach循环示例》

    //foreach测试 public class ForEachTest { public static void main(String[] args) { String[] books = {&q ...

  8. Allegro PCB SI (2)

    整理一下在电研院学的si (虽然彩超的si在频率15Mhz以上后,si是失真的.昨晚遇到孔大哥也是这样说的,板级仿真,要layout过硬,然后找到合适的top test point) Allegro ...

  9. C++数据结构之Queue(队列)

    Queue,队列,和我们日常生活中的队列是同样的规则,"先进先出",从尾入,从首出. Queue,主要有三种基本操作,append(添加元素至队尾):serve(队首元素出列):r ...

  10. My_Python的常用函数.

    范围生成函数 class range(object) | range(stop) -> range object | range(start, stop[, step]) -> range ...