使用 Javascript 更改多个样式属性答案

【问题标题】：Changing more than one style attribute with Javascript使用 Javascript 更改多个样式属性
【发布时间】：2009-11-19 03:15:37
【问题描述】：

我需要为给定元素更改多个样式属性。我知道怎么换一个：document.getElementById(today).style.visibility= "visible"; 但我不确定更改多个的语法，例如可见性、宽度、高度和字体颜色。

【问题讨论】：

标签： javascript coding-style

【解决方案1】：

只是多次调用：

document.getElementById(today).style.visibility = "visible";
document.getElementById(today).style.color = "red";
document.getElementById(today).style.height = "5em";

【讨论】：

非常感谢。下一个技巧是我要更改的属性之一是字体大小，但它似乎不像 document.getElementById(today).style.font-size="x-small";中的“-” >
@Dave，对于包含破折号的 CSS 属性，您必须删除破折号，并将下一个字符大写，即：对于font-size，您应该使用fontSize。

【解决方案2】：

您需要一次引用每个属性，即 .style.width=、.style.height= 等。

你可以像这样缩短打字量：

var g = document.getElementById(today);
g.style.width=100;
g.style.height=100;
g.style.visibility='visible';

【讨论】：

感谢这个迈克尔，我会试一试的。

【解决方案3】：

CSS 方法是创建一个类来执行这些元素的所有通用样式并将类属性分配给它们，

或者，如果它们是可继承的样式，则将元素放在一个共同的父级中，例如 div 并设置 div 的样式

【讨论】：

【解决方案4】：

如果您愿意为该元素替换任何其他内联样式，您可以使用 style.cssText 属性。

document.getElementById('idstring').style.cssText=
'font-size:1em;color:blue;visibility:visible';

【讨论】：