样式表:

.important{

font-weight:bold;

font-size:xx-large;

}

.blue{

color:blue;

}

1.addClass():向被选元素添加一个或多个类

$("button").click(function{

  $("h1,h2,p").addClass("blue");

  $("div").addClass("important");

});

可以在addClass()方法中规定多个类:

$("button").click(function(){

    $("#div1").addClass("important blue");

});

2.removeClass():从被选元素删除一个或多个类

$("button").click(function(){

  $("h1,h2,p").removeClass("blue");

});

3.toggleClass():对被选元素进行添加/删除类的操作

$("button").click(function(){

  $("h1,h2,p").toggleClass("blue");

});

4.css():设置或返回被选元素的一个或多个样式属性

**返回首个匹配元素的background-color值:

$("p").css("background-color");

语法:css("propertyname");

**为所有匹配元素设置background-color值:

$("p").css("background-color","yellow");

语法:css("propertyname","value");

**设置多个CSS属性:

$("p").css({"background-color":"yellow","font-size":"200%"});

语法:css({"propertyname":"value","propertyname":"value",....});

JQuery学习之操作CSS的更多相关文章

  1. jquery学习--属性操作

    学习jquery很长一段时间了,知道对属性操作的方式为: $("#xx1").attr("xx2"); //获取属性值 $("#xx1"). ...

  2. JQuery学习笔记【CSS选择符】--02

    Jquery的程序入口: <html> <head> <title></title> <script type="text/javasc ...

  3. JQuery学习之操作DOM

    1.DOM,就是Document Object Model(文档对象模型) 2.获得内容的方法: **text():设置或返回所选元素的文本内容 $("#btn1").click( ...

  4. 第二十五篇 jQuery 学习7 获取并设置 CSS 类

    jQuery 学习7 获取并设置 CSS 类   jQuery动态控制页面,那么什么是动态呢?我们就说一下静态,静态几乎又纯html+css完成,就是刷新页面之后,不会再出现什么变动,一个实打实的静态 ...

  5. jquery 学习(五) - CSS 操作

    HTML + CSS 样式 /*CSS样式*/<style> body{ margin: 0; } div{ width: 100%; height: 2000px; background ...

  6. jQuery 操作 CSS

    jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: addClass() - 向被选元素添加一个或多个类 removeClass() - 从被选元素删除一个或多个类 toggleCl ...

  7. jQuery基础DOM和CSS操作

    $('#box').html();//获取 html 内容$('#box').text();//获取文本内容,会自动清理 html 标签$('#box').html('<em>www.li ...

  8. JQuery:JQuery操作CSS类

    JQuery:CSS类jQuery - 获取并设置 CSS 类,通过 jQuery,可以很容易地对 CSS 元素进行操作.jQuery 操作 CSSjQuery 拥有若干进行 CSS 操作的方法.我们 ...

  9. jQuery学习之------元素样式的操作

    jQuery学习之------元素样式的操作 一..addClass( className )方法----增加样式 1.addClass( className ) : 为每个匹配元素所要增加的一个或多 ...

随机推荐

  1. JS match() 方法 使用

    javascript中的match函数是使用正则表达式对字符串进行查找,并将查找的结果作为数组返回,在实际开发中非常的有用,使用方法如下: stringObj.match(rgExp) 其中strin ...

  2. [Linux] vim的高亮查找操作

    reference :  http://blog.chinaunix.net/uid-20732478-id-763411.html 使用了VIM这么久,却一直无法牢记一些基本的操作指令.今天查找一个 ...

  3. ld returned 1 exit status"的解决办法

    在Linux下创建线程时,编译时会出现下面的错误,[root@linuxserver 807]# gcc -o 22 22.c/tmp/cc21HcoW.o(.text+0x4c): In funct ...

  4. ShareSdk使用心得

    1. 微信和朋友圈:分享的时候设置了链接和图片,但就是不显示: 需要指明ShareType为WEB_PAGE 2. 需要完整添加 ShareSdk 的所需要的权限,不然分享闪退,并且不报异常:网络请求 ...

  5. auto(c++11)

    C++primer 第五版,第三章出现了此段程序,求解读附源码:代码1:#include<iostream>#include<string>using namespace st ...

  6. 使用drozer连接时提示:Could not find java. Please ensure that it is installed and on your path

    在安装drozer后使用 drozer.bat console connect命令提示如下错误(实际上我已经安装了jdk并添加了path) 参考上面的链接已经它的提示解决方法如下: 建立名为 .dro ...

  7. Android 快速开发框架:推荐10个框架:afinal、ThinkAndroid、andBase、KJFrameForAndroid、SmartAndroid、dhroid..

    对于Android初学者以及对于我们菜鸟,这些大神们开发的轻量级框架非常有用(更别说开源的了). 下面转载这10个框架的介绍:(按顺序来吧没有什么排名). 一.  Afinal 官方介绍: Afina ...

  8. Oracle【IT实验室】数据库备份与恢复之五:Flashback

    Flashback在开发环境(有时生产环境的特殊情况下)是很有用的一个工具.     5.1 9i Flashback 简介     5.1.1  原理 当数据  update  或  delete  ...

  9. js 横幅播放

    js 横幅播放 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  10. 在VS 2015中边调试边分析性能

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 对代码进行性能分析,之前往往是一种独立的Profiling过程,现在在VS 2015中可以结 ...