.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. URAL 1145—— Rope in the Labyrinth——————【求树的直径】

    Rope in the Labyrinth Time Limit:500MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64 ...

  2. EF删除数据

    1.方法一,面向对象 using (MyDbContent content = new MyDbContent()) { content.Entry<UserInfo>(model).St ...

  3. Python数据类型及常用操作

    Python字符串类型 1.用途: 用来记录有描述性的状态.比如:人名,地址等. 2.定义方式: 创建字符串非常简单,在‘ ’,“ ”,‘’‘ ’‘’内一填写一系列的字符例如:msg='hello' ...

  4. cf1059D. Nature Reserve(三分)

    题意 题目链接 Sol 欲哭无泪啊qwq....昨晚一定是智息了qwq 说一个和标算不一样做法吧.. 显然\(x\)轴是可以三分的,半径是可以二分的. 恭喜你获得了一个TLE的做法.. 然后第二维的二 ...

  5. React 表单组件

    诸如 <input>.<textarea>.<option> 这样的表单组件不同于其他组件,因为他们可以通过用户交互发生变化.这些组件提供的界面使响应用户交互的表单 ...

  6. php支付走过的坑(微信篇 包含h5支付和app支付 注册 秘钥 环境等等配置)

    支付这东西,说容易也容易,说难也难 代码这玩意还比较好说 但是 如果没有demo 直接去看官方文档 十有八九一脸懵逼 今天就整理一下 支付这块走过的坑 涉及 微信h5支付 支付宝h5支付 (api文档 ...

  7. 【工作】Proxy Server的优化 - 检测目标网站URL变化

    在工作中,我在组里负责一个Proxy(代理)的Module,这个Module是针对微软的Office 365的邮件门户OWA实现,工作起来后,用户访问Office 365 OWA,无需再输入Offic ...

  8. 解决dubbo-admin管控台不能显示服务的问题

    1.首先在网上下载了dubbo-admin.war,解压后修改dubbo.properties文件 dubbo.registry.address=zookeeper://127.0.0.1:2181 ...

  9. 如何领域驱动设计?-实践感悟&总结分享

    主要是在开发过程中,个人对于领域驱动设计的实践感悟和总结:也是对新进开发人员的培训资料:希望对关注DDD的童鞋有所帮助. 概述 领域驱动不是纯粹的技术问题,领域建模(建立数据表只是一部分)是领域专家( ...

  10. c++基础(积少成多)

    1.#include<string> #include<iostream> 这是引用头文件: 2.Using namespace std; 这是引用命名空间,防止同一个命名空间 ...