jQuery 中 css() 方法的用途是什么？

在开发中，经常需要对 HTML 元素的样式进行修改，而 jQuery 中的 css() 方法可以帮助程序员快速地获取、设置、修改元素的 CSS 属性。

语法

$(selector).css(property, value)

• selector：用于选中需要修改样式的 HTML 元素，可以是标签名、类名、ID 等；
• property：表示需要修改的 CSS 属性，如 color、font-size 等；
• value：表示需要设置的 CSS 属性值，如 red、14px 等。

用途

获取元素样式

使用 css() 方法可以获取指定元素的 CSS 属性的值，如下：

$(selector).css(property)

示例：

// 获取 p 元素的 font-size 属性值，返回 16px
$('p').css('font-size');

设置元素样式

使用 css() 方法可以设置指定元素的 CSS 属性的值，如下：

$(selector).css(property, value)

示例：

// 将 p 元素的 font-size 属性设置为 18px
$('p').css('font-size', '18px');

同时设置多个样式

使用 css() 方法可以同时设置多个 CSS 属性的值，如下：

$(selector).css({
   property1:value1,
   property2:value2,
   ...
});

示例：

// 将 p 元素的 font-size 属性设置为 18px，color 属性设置为蓝色
$('p').css({'font-size':'18px', 'color':'blue'});

回调函数

使用 css() 方法可以通过回调函数对元素的 CSS 属性进行修改，如下：

$(selector).css(property, function(index, value){ ... })

• index：当前元素在选择器中的索引；
• value：表示当前 CSS 属性的原始值。

示例：

// 将 p 元素的 font-size 属性值加倍
$('p').css('font-size', function(index, value) {
    return parseInt(value) * 2 + 'px';
});

以上是 jQuery 中 css() 方法的用途。除此之外，css() 方法还可以用于动画效果的设置。如果想深入学习 jQuery，可以阅读官方文档：https://api.jquery.com/css/