在 JavaScript 中改变 CSS 有三种方法：使用 document.styleSheets 属性修改样式表规则。直接通过元素的 style 属性设置或修改 CSS 样式。使用 CSSOM API 访问和修改 CSS 样式规则。
如何在 JavaScript 中改变 CSS
前言
JavaScript 是一种强大的编程语言，可用于动态修改网页内容和样式。本文将介绍如何在 JavaScript 中改变 CSS。
使用 document.styleSheets
立即学习“前端免费学习笔记（深入）”；
document.styleSheets 属性返回当前文档的所有样式表。我们可以通过以下方式来改变样式：
<code class="javascript">// 获取第一个样式表
const sheet = document.styleSheets[0];
// 添加一条新规则
sheet.addRule('body', 'background-color: red;');
// 修改现有规则
sheet.rules[0].style.color = 'blue';</code>使用 style 属性
每个 HTML 元素都有一个 style 属性，它是一个 CSS 属性的集合。我们可以通过以下方式来改变样式：
<code class="javascript">// 获取 body 元素
const body = document.querySelector('body');
// 设置背景色
body.style.backgroundColor = 'red';
// 设置字体颜色
body.style.color = 'blue';</code>使用 CSSOM API
CSSOM API 提供了一组方法来访问和修改 CSS 样式规则。使用以下方法可以改变样式：
<code class="javascript">document.getElementById('myElement').classList.add('active');
document.getElementById('myElement').style.setProperty('color', 'red');</code>注意：
以上就是js如何改变css的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
931
收藏
