一.css()用法:
1.设置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" });
2.获取css样式:
//获取样式 //css(name) //name:想要获取的样式 $("li").eq(0).css("fontSize");
二.class()的用法:
1.class()设置
addClass()方法向匹配的元素增加指定的类名(一个或多个) 注意:对于元素来说,class属性可以有多个值.该方法不会移除已经存在的值,而是在原有的基础上追加一个或多个class属性. 实例:$('li').addClass('basic'); //为li元素追加一个basic类
2.删除class
$('li').removeClass('basic');//移除basic这个类样式 $('li').removeClass();//移除li元素的全部类样式
3.判断class
// hasClass()方法是用来检查被选择的元素是否包含指定的class名 //返回一个布尔值true或者false $('li').hasClass("basic");//其中class是必须的值,规定需要在指定元素中查找的类名。 $('li').hasClass("basic className");//判断多个类 //与.is()一样 $('li').is('.basic')//同样检查是否包含指定的class名 注意带上点类名 $('li').is("basic className")//判断多个类
4.切换类:
//判断li有没有basic类,如果有,就移除他,如果没有,添加他 $("li").toggleClass("basic"); //$(selector).toggleClass(function(index,class),switch) //函数定义返回需要添加或删除的一个或多个类名 //index - 可选,接受选择器的索引位置。 //class - 可选,接受选择器的当前的类。 //switch - 可选。布尔值,为true则加上对应的class,否则就删除。 $('input').click(function () { $("li").toggleClass(function () { return "basic"; })