欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jQuery---CSS操作

程序员文章站 2022-04-10 13:41:54
CSS操作 修改单个样式 // css(name, value) // 修改单个样式 // name:样式名 value:样式值 $("li") .css("backgroundColor", "pink") .css("color", "red") .css("fontSize", "32px") ......

css操作

修改单个样式

      // css(name, value)
      // 修改单个样式
      // name:样式名 value:样式值

      $("li")
        .css("backgroundcolor", "pink")
        .css("color", "red")
        .css("fontsize", "32px");

 

修改多个样式,传一个对象作为参数

      //css(obj)
      //修改多个样式
      $("li").css({
        backgroundcolor: "pink",
        color: "red",
        fontsize: "32px",
        border: "1px solid black"
      });

 

获取样式

      //获取样式
      //css(name)
      //name:想要获取的样式
      $("li").css("backgroundcolor", "20px");

 

获取样式,获取时候只返回第一个元素对应的值

      //获取样式
      //css(name)
      //name:想要获取的样式
      $("li").eq(0).css("fontsize", "20px");
      $("li").eq(1).css("fontsize", "21px");
      $("li").eq(2).css("fontsize", "22px");
      $("li").eq(3).css("fontsize", "23px");


      //隐式迭代:
      // 设置操作的时候:会给jq内部的所有对象都设置上相同的值。
      // 获取的时候:只会返回第一个元素对应的值。
      console.log($("li").css("fontsize"));//20px

 

jQuery---CSS操作