jquery操做样式 jq修改添加css样式和class样式类

时间 2020-01-04 标签 jquery 操做样式 jq 修改添加 css 样式 class 样式类

CSS操做css

功能：设置或者修改样式，操做的是style属性。java

设置单个样式：面试

//name：须要设置的样式名称
//value：对应的样式值
css(name, value);
//使用案例
$("#one").css("background","gray");//将背景色修改成灰色

设置多个样式：segmentfault

//参数是一个对象，对象中包含了须要设置的样式名和样式值
css(obj);
//使用案例
$("#one").css({
    "background":"gray",
    "width":"400px",
    "height":"200px"
});

获取样式：code

//name:须要获取的样式名称
css(name);
//案例
$("div").css("background-color");

注意：获取样式操做只会返回第一个元素对应的样式值。对象

隐式迭代：排序

1.设置操做的时候，若是是多个元素，那么给全部的元素设置相同的值rem

2.获取操做的时候，若是是多个元素，那么只会返回第一个元素的值。get

class操做验证码

添加样式类：

//name：须要添加的样式类名，注意参数不要带点.
addClass(name);
//例子,给全部的div添加one的样式。
$(“div”).addClass(“one”);

移除样式类

//name:须要移除的样式类名
removeClass(“name”);
//例子，移除div中one的样式类名
$(“div”).removeClass(“one”);

判断是否有样式类:

//name:用于判断的样式类名，返回值为true false
hasClass(name)
//例子，判断第一个div是否有one的样式类
$(“div”).hasClass(“one”);

切换样式类:

//name:须要切换的样式类名，若是有，移除该样式，若是没有，添加该样式。
toggleClass(name);
//例子
$(“div”).toggleClass(“one”);