必须用 getcomputedstyle 读取 css 自定义属性，因其返回最终计算值而非原始声明；style.getpropertyvalue 只读内联样式，易漏全局变量；返回值恒为字符串且错误时静默返回空字符串；无原生监听机制，需手动重读；ie 完全不支持。
直接用 getComputedStyle 读取 :root 或元素上的 CSS 自定义属性
浏览器不提供专门读取 --my-color 这类属性的 API，必须通过 getComputedStyle 获取计算后的字符串值。它返回的是最终生效的 CSS 值（包括继承、级联后结果），不是原始声明。
常见错误是直接访问 style 属性：element.style.getPropertyValue('--color') 只能读内联样式里声明的值，漏掉 :root 或 class 中定义的。
正确做法：
-
getComputedStyle(document.documentElement).getPropertyValue('--primary-color')—— 读:root下全局变量 -
getComputedStyle(myDiv).getPropertyValue('--text-size')—— 读某个元素上实际计算出的值（可能继承自父级） - 返回值总是字符串，哪怕你设的是数字：
'16px'、'#333'、'0.8'，需手动转换类型
读取失败时返回空字符串，不是 null 或 undefined
如果属性名拼错、作用域不对（比如在未继承该变量的元素上调用）、或变量本身没被定义，getPropertyValue 会安静地返回 ''（空字符串），不会报错也不会警告。
容易踩的坑：
- 把
--main-bg写成main-bg（漏了两个短横） - 在尚未挂载到 DOM 的元素上调用
getComputedStyle，返回空对象 - 在
:root未定义该变量，却默认它存在，后续逻辑因空字符串意外中断
建议加一层判断：const val = getComputedStyle(el).getPropertyValue('--size'); if (!val.trim()) { /* 处理缺失 */ }
Java JDK 25 来自 OpenJDK 官方归档，版本为 JDK 25，本条下载地址已指向官方 Windows x64 zip 安装包直链，适合调试旧项目或兼容旧版 Java 运行环境。
动态响应 CSS 变量变化？原生不支持监听，得靠 MutationObserver 或手动触发
CSS 自定义属性本身没有变更事件。修改 document.documentElement.style.setProperty('--color', 'red') 后，已存在的 getComputedStyle 结果不会自动更新 —— 它只在你再次调用时重新计算。
如果你需要“响应式”读取（比如主题切换后立刻拿到新值），注意：
- 不能依赖缓存：每次都要重新调用
getComputedStyle - 不要试图监听
style属性变化 —— 它不反映 CSSOM 实际计算结果 - 若大量频繁读取，可节流，但别用
requestAnimationFrame包裹读取逻辑，因为getComputedStyle本身会强制同步布局（layout thrashing 风险）
兼容性没问题，但 IE 完全不支持
getComputedStyle 和 CSS 自定义属性都是现代标准，Chrome 49+、Firefox 31+、Safari 9.1+、Edge 15+ 都支持。但 IE 11 及更早版本既不支持 --var 语法，也不支持 getPropertyValue 读取它们。
如果项目还需兼容 IE：
- 不要指望 JS 读取到任何自定义属性值
- 改用预设的 class 名或 data 属性做降级方案，例如：
document.body.dataset.theme === 'dark' - 避免在关键路径中依赖
getPropertyValue返回值作逻辑分支，否则 IE 下会静默失效
真正麻烦的不是读不到，而是读不到时行为不一致又难以调试 —— 尤其当 fallback 逻辑藏在深层函数里。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
