在网页开发中，我们经常需要使用 JavaScript 动态地修改HTML元素的样式。好在有 jQuery 这个库可以帮助我们轻松完成这个工作。而jq（即jQuery）是一个基于JavaScript的开源库，它使得使用JavaScript更加方便和快捷。
什么是 jq?
如上所述，jq 是一个基于 JavaScript 的开源库，旨在简化 HTML 文档遍历、事件处理、动画设计等操作。 它拥有一套简单易用的API，并且广受欢迎。
要使用 jq 库，你需要将其添加到 HTML 页面中。 如果你已经使用了前端框架（例如 Angular 或 React），那么 jq 可能已经被默认包含了。否则，你可以通过以下链接下载 jq：
如何使用 jq 设置 CSS 样式？
我们需要选取一个或多个 HTML 元素，并为它们设置样式。 在 jq 中，我们可以使用 css() 函数来设置元素的 CSS 属性值。
// 选择所有 class 为 my-class 的元素，并将它们的背景颜色设为红色
$(".my-class").css("background-color", "red");
您还可以一次设置多个属性:
// 同时设置 'font-size' 和 'color'
$("p").css({
"font-size": "20px",
"color": "blue"
});
您还可以使用相对值：
// 将元素的宽度增加 200 像素
$("div").css("width", "+=200");
您可以通过 addClass()、removeClass() 和 toggleClass() 函数添加、删除和切换类名。这些函数非常有用，因为它们使我们能够与 CSS 类一起使用 jq。
// 向所有段落添加一个新类 'my-new-class'
$("p").addClass("my-new-class");
// 删除所有段落的旧类 'my-old-class'
$("p").removeClass("my-old-class");
// 切换所有段落的类名 'my-class' 和 'my-other-class'
$("p").toggleClass("my-class my-other-class");
结论
在本文中，我们介绍了 jq 的概念和基本语法，以及如何使用它来设置 HTML 元素的 CSS 样式。jq 允许我们轻松地选择、修改和操作 HTML 元素，这使得前端开发变得更加简单和快捷。