首页 > 代码库 > JQuery学习之操作CSS
JQuery学习之操作CSS
样式表:
.important{
font-weight:bold;
font-size:xx-large;
}
.blue{
color:blue;
}
1.addClass():向被选元素添加一个或多个类
$("button").click(function{
$("h1,h2,p").addClass("blue");
$("div").addClass("important");
});
可以在addClass()方法中规定多个类:
$("button").click(function(){
$("#div1").addClass("important blue");
});
2.removeClass():从被选元素删除一个或多个类
$("button").click(function(){
$("h1,h2,p").removeClass("blue");
});
3.toggleClass():对被选元素进行添加/删除类的操作
$("button").click(function(){
$("h1,h2,p").toggleClass("blue");
});
4.css():设置或返回被选元素的一个或多个样式属性
**返回首个匹配元素的background-color值:
$("p").css("background-color");
语法:css("propertyname");
**为所有匹配元素设置background-color值:
$("p").css("background-color","yellow");
语法:css("propertyname","value");
**设置多个CSS属性:
$("p").css({"background-color":"yellow","font-size":"200%"});
语法:css({"propertyname":"value","propertyname":"value",....});
JQuery学习之操作CSS