.addClass()
  为每个匹配的元素添加指定的样式类名
  .addClass(className)
    className 为每个匹配元素所有增加的一个或多个样式名
  .addClass(function(index,currentClass))
    函数返回一个或者多个用空格隔开, index 表示参数匹配中的索引位置 this 指向匹配元素集合中的当前元素。
  $("p").addClass("myClass yourClass"); 给p 这个元素添加这两个类名样式。
  $("ul li:last").addClass(function(index){
    return "item-"+index;
  }) 在最后一个<li> 元素上加上“item-1”样式。

.css()
  获取匹配元素集合中的第一个元素的样式属性计算值或设置每一个匹配元素的一个或多个
  css属性。

  .css(propertyName)
    propertyName 一个css 属性名 。 一个或者多个css 属性组成的数组。
  $(this).css("background-color"); 获取当前元素的背景颜色。
  $(this).css(["width","height",color]) 获取当前元素的 宽 高 字体颜色。

  .css(propertyName,value)
    propertyName 一个css 属性名。
    value 设置这个css 的属性值。
  .css(propertyName,function)
    propertyName 一个css 属性名。
    function 一个用来返回设置值的函数。this,是当前元素。

  $('div.example').css('width',function(index){
    return index*50;
  }) 设置一个匹配元素的宽度增加到较大的值。
  $("p").mouseover(function(){
    $(this).css("color","red");
  }) 当鼠标经过p 元素时文字变成红色。
  $("#box").one("click",function(){
    $(this).css("width","+=200")
  }) 增加#box 的宽度为200像素。

.hasClass()
  确定任何一个匹配的元素是否有被分配给定的(样式类)
  .hasClass(className)
  className 要查询的样式名。
  $("#mydiv").hasClass("foo") 匹配的元素是否含有 foo这个样式
  如果有这个样式那么就返回true 如果没有那么就返回false

.removeClass()
  移除匹配的元素上面的样式。
  .removeClass([className])
    每个匹配元素移除的一个或者多个用空格隔开的样式名。
  $("p").removeClass("myClass yourClass")
  .removeClass(function(index,class))
    一个函数,返回一个或多个要移除的元素,index 所有匹配的元素集合中的当前的元素。

.toggleClass()
  在匹配的元素集合中的每个元素上切换样式名
  .toggleClass(className)
    className 在匹配的元素集合中的每个元素上用来切换的一个或多个(用空格隔开)样式类名。
  .toggleClass(className,switch)
    switch 一个布尔值,用于判断样式是否应该被添加或移除。
  .toggleClass([switch])
    switch 一个用来判断样式类天添加还是移除的布尔值。

  $('#foo').toggleClass(className,add0rRemove) 就等同于
  if(add0rRemove){
    $('#foo').addClass(className);
  }else{
    $('#foo').removeClass(className)
  }

  $("p").click(function(){
  $(this).toggleClass("highlight");
    //点击当前的p 标签的时候切换样式。
  })

jquery 操作css 选择器的更多相关文章

  1. JQuery:JQuery操作CSS类

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

  2. jQuery操作css样式

    jQuery操作css样式 css操作的分类: css操作 位置操作 尺寸操作 css操作之css css代码: html代码: jQuery代码: 效果如下: css操作之位置操作 css代码: h ...

  3. jquery操作css样式的方法

    jquery操作css样式的方法(设置和获取)

  4. jQuery 操作 CSS

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

  5. JQUERY操作css与css()方法、获取设置尺寸;

    一.jQuery addClass() 方法 向不同的元素添加 class 属性.在添加类时,您也可以选取多个元素 <style> .aa { color:red; }; </sty ...

  6. jquery操作CSS样式全记录

    $(this).click(function(){  if($(this).hasClass(“zxx_fri_on”)){    $(this).removeClass(“zxx_fri_on”); ...

  7. jQuery操作css

    jQuery addClass() 方法 向被选中元素添加class属性,参数为属性值 $("div").addClass("imp"); 也可以同时向多个元素 ...

  8. Jquery操作属性选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. Jquery操作层级选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. UGUI Slider

    1.新建一个Cube命名为Player,在上面挂一个脚本命名为Player,脚本内容如下: using System.Collections; using System.Collections.Gen ...

  2. python3+Appium自动化11-data数据封装之python读取csv文件

    使用背景 实际项目中,我们的测试数据可能存储在一个数据文件中,如txt.excel.csv文件类型.我们可以封装一些方法来读取文件中的数据来实现数据驱动 enumerate()简介 enumerate ...

  3. LoadScene场景异步加载

    LoadScene场景异步加载 using UnityEngine; using System.Collections; using UnityEngine.SceneManagement; usin ...

  4. [转]显示农历日期的JS

    本文转自:http://blog.sina.com.cn/s/blog_47377e77010009xc.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD ...

  5. (转)Python3.5 day3作业二:修改haproxy配置文件

    原文:http://www.cnblogs.com/iwxk/p/6010018.html

  6. LeetCode 367.有效的完全平方数(C++)

    给定一个正整数 num,编写一个函数,如果 num 是一个完全平方数,则返回 True,否则返回 False. 说明:不要使用任何内置的库函数,如  sqrt. 示例 1: 输入:16 输出:True ...

  7. 关于Yahoo十四条军规与前端性能优化

    关于Yahoo十四条军规与前端性能优化 热度 4已有 223 次阅读2014-8-3 15:01 |个人分类:前端相关|系统分类:前端优化| 前端优化, yahoo, 性能优化 启用Gzip压缩.Gz ...

  8. 谷歌添加百度翻译提示Google已将百度翻译标记为恶意程序并阻止安装,怎么办

    进入谷歌浏览器的设置, 显示高级设置——隐私设置下七个选项中的第四个选项(启用针对网上诱骗和恶意软件的防护功能)把勾去掉,然后将百度翻译的CRX拖动到chrome的安装插件页面, 修改chrome的限 ...

  9. C# .NET中自带的委托Actoin、Func详解

    委托是.NET中强大的功能,而.NET为我们提供了2个非常实用的泛型委托,分别是Action.Func [Action] Action是.NET内部提供的一个无返回值.泛型的委托,有16重载,分别是0 ...

  10. 弹性布局 Flexible Box

    页面中任何一个元素都可以指定为 弹性布局(Flex) 属性:display 取值: 1.flex     将块级元素变为弹性布局容器 2.inline-flex   将行内元素变为弹性布局容器 兼容性 ...