如何使用 jQuery 检测和更改 div 的内容样式？

在使用 jQuery 进行 DOM 操作时，检测和更改 div 的内容样式是很常见的操作。下面就来介绍一下如何使用 jQuery 进行该操作。

检测 div 的内容样式

我们可以使用 jQuery 提供的 .css() 方法来获取 div 的内容样式。该方法可以接收一个或多个属性名称作为参数，返回这些属性的当前值。

示例代码：

// 获取 div 的 color 样式
var color = $('#myDiv').css('color');
console.log(color); // 输出当前 color 样式的值

// 获取 div 的 background-color 和 font-size 样式
var styles = $('#myDiv').css(['background-color', 'font-size']);
console.log(styles); // 输出当前 background-color 和 font-size 样式的值

以上代码中，我们首先获取了 div 的 color 样式，然后获取了 div 的 background-color 和 font-size 样式。可以看到，.css() 方法既可以接收单个属性名称，也可以接收多个属性名称。

更改 div 的内容样式

我们可以使用 .css() 方法来更改 div 的内容样式。同样可以接收一个或多个属性名称和值作为参数。我们还可以使用对象来一次性更改多个样式。

示例代码：

// 更改 div 的 color 样式为 red
$('#myDiv').css('color', 'red');

// 同时更改 div 的 background-color 和 font-size 样式
$('#myDiv').css({
  'background-color': 'blue',
  'font-size': '14px'
});

以上代码中，我们首先使用 .css() 方法更改了 div 的 color 样式为 red，然后使用对象同时更改了 div 的 background-color 和 font-size 样式。

总结

查看和更改 div 的内容样式是常见的 jQuery 操作，.css() 方法可以帮助我们快速实现这些操作。我们可以通过该方法获取一个或多个属性的当前值，也可以通过该方法更改一个或多个属性的值。