我有以下 JavaScript 变量：
var fontsize = "12px"
var left= "200px"
var top= "100px"
我知道我可以像这样迭代地将它们设置为我的元素：
document.getElementById("myElement").style.top=top
document.getElementById("myElement").style.left=left
是否可以一次将它们全部设置在一起，像这样？
document.getElementById("myElement").style = allMyStyle
如果您将 CSS 值作为字符串，并且没有为元素设置其他 CSS（或者您不关心覆盖），请使用cssText属性：
document.getElementById("myElement").style.cssText = "display: block; position: absolute";
您还可以使用模板文字来获得更简单、更易读的多行类 CSS 语法：
document.getElementById("myElement").style.cssText = `
display: block;
position: absolute;
`;
这在某种意义上很好，因为它避免了每次更改属性时重新绘制元素（以某种方式“一次”更改它们）。
另一方面，您必须先构建字符串。
Object.assign(yourelement.style,{fontsize:"12px",left:"200px",top:"100px"});
这也使您能够合并样式，而不是重写 CSS 样式。
你也可以做一个快捷功能：
const setStylesOnElement = function(styles, element){
Object.assign(element.style, styles);
}
@Mircea：在单个语句中为元素设置多种样式非常容易。它不会影响现有属性并避免使用 for 循环或插件的复杂性。
document.getElementById("demo").setAttribute(
"style", "font-size: 100px; font-style: italic; color:#ff0000;");
小心：如果稍后您使用此方法添加或更改样式属性，则之前使用“setAttribute”设置的属性将被删除。
制作一个函数来处理它，并使用您想要更改的样式将参数传递给它。
function setStyle( objId, propertyObject )
{
var elem = document.getElementById(objId);
for (var property in propertyObject)
elem.style[property] = propertyObject[property];
}
并像这样称呼它
setStyle('myElement', {'fontsize':'12px', 'left':'200px'});
对于 propertyObject 中的属性值，您可以使用变量..
我只是在这里偶然发现，我不明白为什么需要这么多代码来实现这一点。
使用String Interpolation添加您的 CSS 代码。
let styles = `
font-size:15em;
color:red;
transform:rotate(20deg)`
document.querySelector('*').style = stylesa