1.CSS(name,value)

  修改单个样式

  1. $(function(){
  2. $(".divcontent").css("background","red"); //修改背景颜色为红色
  3. });

  2.CSS({}); 

  修改多个样式

  

  1. $(function(){
  2. $(".divcontent").css({
  3. //边框 1像素实线 红色
  4. border:"1px solid red",
  5. //背景颜色绿色
  6. background:"green"
  7. });
  8. });

  3.Css(name);

  获取样式

  1. $(function(){
  2. //返回rgb(0,0,0);
  3. console.log($(".divcontent").css("background"));
  4. });

  获取已设置的样式或默认的样式,如果是给多个“li”设置的样式,则返回第一个li元素的样式

  

  1. $(function(){
  2. $("li:first").css("fontSzie","16px");
  3. $("li").eq(1).css("fontSize","24px");
  4. $("li").eq(2).css("fontSize","44px");
  5. console.log($("li").css("fontSize")); //返回16px
  6. });

隐士迭代:偷偷的for循环

  设置的时候:会给JQ内部所有的对象都设置相同的值

  获取的时候:只会返回第一个元素对应的值

  4.class操作:

    4.1添加类:addClass("类名");               //类型不需要加.

    在原有的基础上添加类,不覆盖任何类

    4.2移除类:removeClass("类名");

    4.3判断类:hasClass("类名");

    4.4切换类:toggleClass("类名");

  1. <script>
  2. //记住 click()里面是方法 加上function
  3. //添加类
  4. $("#p").click(function(){
  5. $("ul").addClass("boot");
  6. });
  7. //移除类
  8. $("input").eq(1).click(function(){
  9. $("ul").removeClass("boot");
  10. });
  11. //判断类
  12. $("input").eq(2).click(function(){
  13. var a=$("ul").hasClass("boot");
  14. if(a){
  15. $("ul").removeClass("boot");
  16. }else{
  17. $("ul").addClass("boot");
  18. }
  19. });
  20.  
  21. //切换类
  22. $("input").eq(3).click(function(){
  23. $("ul").toggleClass("boot");
  24.  
  25. });
  26.  
  27. </script>

  

Jquery操作样式的更多相关文章

  1. 测开之路一百零四:jquery操作样式

    jquery操作样式 添加样式.删除样式 切换样式 css("属性","值") css("属性","值"), 修改多个 ...

  2. JQuery操作样式以及JQuery事件机制

    1.操作样式     1.1 css的操作     功能:设置或者修改样式,操作的是style属性 操作单个样式 // name:需要设置的样式名称 // value:对应的样式值 // $obj.c ...

  3. jQuery操作样式知识总结

    css操作 功能:设置或者修改样式,操作的是style属性. 设置单个样式 //name:需要设置的样式名称 //value:对应的样式值 css(name, value); //使用案例 $(&qu ...

  4. jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  5. 2016/4/1 jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  6. jquery 操作

    Jquery使用时要引用,引用时放在最前. Jquery: $代表选择器, $(document) ready(function(e){}):找到页面,页面加载完成后执行. JS选取元素操作内容操作属 ...

  7. JQuery操作DOM(8)

    一.jQuery操作样式 1.设置和获取样式 /* 单个样式 */ $(selector).css(属性,值): /* 多个样式 */ $(selector).css({属性:值,属性:值}); /* ...

  8. 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式

    本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...

  9. jQuery入门(2)使用jQuery操作元素的属性与样式

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

随机推荐

  1. Notes for Apue —— chapter 4 Files and Directories(文件和目录)

    4.1 Introduction 4.2 stat, fstat, fstatat, and lstat Functions The lstat function is similar to stat ...

  2. WPF 内存泄漏优化经历

    最近公司有个CS客户端程序,有个登录界面,有个程序的主界面,程序支持注销功能,但是在注销后,客户端的内存一直以40M-50M的速度递增,因此猜测,应该是WPF程序出现了内存泄漏.下面主要记录优化内存泄 ...

  3. 【BZOJ2595】 [Wc2008]游览计划

    BZOJ2595 [Wc2008]游览计划 Solution 考虑这是一个最小费用连通性的问题,既然大家都说这是什么斯坦纳树那就是的吧... 所以我们肯定可以这样设一个dp状态: \(dp_{i,j, ...

  4. BZOJ 5194--[Usaco2018 Feb]Snow Boots(STL)

    5194: [Usaco2018 Feb]Snow Boots Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 81  Solved: 61[Submi ...

  5. D02-R语言基础学习

    R语言基础学习——D02 20190423内容纲要: 1.前言 2.向量操作 (1)常规操作 (2)不定长向量计算 (3)序列 (4)向量的删除与保留 3.列表详解 (1)列表的索引 (2)列表得元素 ...

  6. centos7搭建mysql5.7主从同步

    主从基本概念 mysql主从同步定义 主从同步使得数据可以从一个数据库服务器复制到其他服务器上,在复制数据时,一个服务器充当主服务器(master),其余的服务器充当从服务器(slave).因为复制是 ...

  7. golang 切片和数组在for...range中的区别

    切片是引用类型,而数组是值类型,并且for...range有以下规则: range表达式只会在for语句开始执行时被求值一次,无论后边会有多少次迭代 range表达式的求值结果会被复制,也就是说,被迭 ...

  8. POJ 2410

    #include <iostream> #include <cmath> #include <string> using namespace std; int gi ...

  9. [LeetCode] 206. Reverse Linked List_Easy tag: Linked List

    Reverse a singly linked list. Example: Input: 1->2->3->4->5->NULL Output: 5->4-> ...

  10. Postgresql客户端不能远程连接数据库服务器 org.postgresql.util.PSQLException:

    Postgresql安装完成之后,默认情况下是不允许远程客户端直接连接的,并且默认的监听配置文件里边,监听的服务器地址是127.0.0.1即:localhost 报如下错误: org.postgres ...