直接修改 element.style 最快但仅覆盖内联样式；彻底控制优先级或批量更新需操作 class 或 CSSStyleSheet；注意单位、驼峰命名、避免连写属性覆盖，推荐 classList 管理预设样式，动态规则适用于主题切换等高级场景。
直接改 element.style 最快，但只覆盖内联样式；想彻底控制样式优先级或批量更新，得操作 class 或 CSSStyleSheet 规则。
用 element.style 改单个元素的内联样式
这是最常用、响应最快的动态改样式方式，适用于临时高亮、动画起始态、表单反馈等场景。注意它只影响 style 属性，不触碰 CSS 文件或 class 定义。
-
style属性名用驼峰写法：element.style.backgroundColor，不是background-color - 设置值必须带单位（
px、%、em等），element.style.opacity = 0.5是例外（无单位） - 读取时只能拿到内联样式值，查不到 CSS 文件里定义的值，要用
getComputedStyle() - 慎用连写属性如
style.border，容易覆盖掉border-width/border-color等子属性
用 classList 切换预设样式组
比反复写 style.xxx = yyy 更可靠，也更符合关注点分离原则。所有样式逻辑集中在 CSS 中，JS 只管“开/关”状态。
-
element.classList.add("active")、.remove("hidden")、.toggle("loading")是标准用法 - 多个 class 可一次操作：
element.classList.add("a", "b", "c") - 判断是否存在：
element.classList.contains("disabled")，比正则匹配className字符串安全得多 - 避免直接赋值
element.className = "new"，会清空所有已有 class
动态插入或修改 CSS 规则（高级场景）
适合主题切换、运行时生成主题色变量、或需全局生效但又不想提前写死所有 class 的情况。普通业务开发极少需要，但遇到真需求时绕不开。
动态WEB网站中的PHP和MySQL：直观的QuickPro指南第2版
下载
动态WEB网站中的PHP和MySQL详细反映实际程序的需求，仔细地探讨外部数据的验证(例如信用卡卡号的格式)、用户登录以及如何使用模板建立网页的标准外观。动态WEB网站中的PHP和MySQL的内容不仅仅是这些。书中还提到如何串联JavaScript与PHP让用户操作时更快、更方便。还有正确处理用户输入错误的方法，让网站看起来更专业。另外还引入大量来自PEAR外挂函数库的强大功能，对常用的、强大的包
立即学习“Java免费学习笔记（深入）”；
- 往
标签里追加规则：document.styleSheets[0].insertRule(".theme-dark { color: white; }", 0) - 修改已有规则：先用
cssRules查到目标 rule，再改rule.style.color = "#333" - 注意跨域限制：无法修改外链 CSS 文件对应的
CSSStyleSheet - IE 用
addRule()和removeRule()，现代浏览器已废弃，优先用标准insertRule/deleteRule
真正难的不是怎么改，而是改完要不要同步更新 ARIA 属性、键盘焦点、或触发 resize/reflow 监听——这些常被忽略，却直接影响可访问性和性能。
