JQuery中操作Css样式的方法

JQuery是一个接口简单、易于使用的JavaScript库，它使得JavaScript的开发变得更加简单高效。在JQuery中，通过一系列的方法可以轻松地操作HTML文档中的元素，其中就包括操作CSS样式的方法。

操作Css样式的方法

addClass()

addClass()方法可以向被选元素添加一个或多个类名。语法格式如下:

$(selector).addClass(classname,function(index,currentclass));

其中，selector表示要操作的元素，classname表示要添加到元素中的一个或多个Class，可以是单个ClassName也可以是多个ClassName，多个ClassName之间以空格分隔。该方法还可接受一个可选的参数function(index,currentclass)，这个参数是一个函数，用于根据元素的index和当前class列表计算出需要添加的class。

例如，以下代码为id为myDiv的元素添加了一个名为"highlight"的class：

$("#myDiv").addClass("highlight");

同时，以下代码给class为"myDiv1"和class为"myDiv2"的元素同时添加了一个名为"highlight"的class：

$(".myDiv1, .myDiv2").addClass("highlight");

css()

css()方法可以获取或设置给定元素的CSS属性。语法格式如下：

$(selector).css(propertyname,value);

其中，propertyname表示要获取或设置的CSS属性名，value表示要设置的属性值，如果没有value参数，则该方法返回propertyname属性的值。

例如，以下代码为id为myDiv的元素设置了它的背景颜色为红色：

$("#myDiv").css("background-color", "red");

同时，以下代码获取了id为myDiv的元素的背景颜色属性值：

var bgColor = $("#myDiv").css("background-color");

例子说明

示例1

假设我有一个class为"menu-item"的菜单列表，我想要将其中第一个元素的背景色设置为绿色，我可以使用以下代码实现：

$(".menu-item:first").css("background-color", "green");

示例2

假设我有一个class为"nav"的导航条，我想要向其中最后一个元素添加一个名为"selected"的class，我可以使用以下代码实现：

$(".nav:last").addClass("selected");