如何使用 JavaScript 动态更改 CSS 样式属性？

使用 JavaScript 动态修改样式属性

假设您有一个为 DIV 元素定义的 CSS 样式表。需要使用 JavaScript 动态修改该 DIV 的特定属性。如何有效地实现这一点？

简单地说...

要动态更改样式属性，请使用以下语法：

document.getElementById("elementID").style.attributeName = "newAttributeValue";

示例：

document.getElementById("xyz").style.paddingTop = "10px";

此代码修改成功ID 为“xyz”的 DIV 的 padding-top 属性值为“10px”。

样式属性的替代表示法：

此外，您还可以对样式属性使用破折号符号：

document.getElementById("xyz").style["padding-top"] = "10px";

这种替代语法允许您使用其指定样式属性带连字符的 CSS 等效项。

以上是如何使用 JavaScript 动态更改 CSS 样式属性？的详细内容。更多信息请关注PHP中文网其他相关文章！