JavaScript修改元素style属性仅操作内联样式，需用驼峰命名（如backgroundColor）、带单位赋值，可用Object.assign批量设置，读取时仅返回内联值，计算样式需getComputedStyle。
直接用 JavaScript 修改元素的 style 属性，就是操作其内联样式（inline styles），本质是修改元素 DOM 对象的 style 这个 CSSStyleDeclaration 对象。
基本语法：点号或方括号设置单个样式
每个 CSS 属性在 JS 中对应一个驼峰命名的属性名（如 background-color → backgroundColor，font-size → fontSize）：
element.style.color = "red";element.style.fontSize = "16px";element.style.backgroundColor = "#f0f0f0";- 也可用方括号语法（适合含短横线或动态属性名）：
element.style["z-index"] = "10";
注意：只影响内联样式，不覆盖 CSS 类或外部样式表
style 属性仅读写元素的 style HTML 属性值（即写在标签里的 style="..."），不会修改 class、CSS 文件或 <style> 块中的规则。即使设置了 element.style.display = "none"，如果类里有 display: block !important，仍可能被覆盖（因 !important 优先级更高）。
批量设置多个样式：用 Object.assign 或循环
避免重复写 element.style.xxx 多次，可一次性赋值：
立即学习“Java免费学习笔记（深入）”；
- 推荐方式（简洁安全）：
Object.assign(element.style, {<br> color: "blue",<br> fontSize: "18px",<br> marginTop: "10px"<br>}); - 兼容旧浏览器可用 for…in 循环遍历对象，逐个赋值
获取当前内联样式值：直接读取 style 属性
element.style.width 只返回内联设置的值（如 "200px"），若没设过则为空字符串。要获取最终计算后的样式（含 CSS 类、继承等），需用 getComputedStyle(element).width。
不复杂但容易忽略：驼峰命名规则、仅作用于内联样式、赋值必须带单位（如 px、%），否则多数属性无效。
