javascript - 使用 JavaScript 添加多个样式

标签 javascript html css

我想用 JavaScript 添加多行 CSS。我知道我可以做到这一点:

document.getElementById(id).style.property=new style

如:

<!DOCTYPE html>
<html>
<body>

<h1 id="id1">My Heading 1</h1>

<button type="button" 
onclick="document.getElementById('id1').style.color = 'red'">
Click Me!</button>

</body>
</html>

但是,上面的代码只允许我添加一个 CSS 属性。如果要添加多个属性,如下所示:

#id1 {
    color: red;
    background-color: beige;
    padding-bottom: 2px;
    margin: 3px;
}

如何通过不重复来添加所有这些:

document.getElementById(id).style.property=new style

....一次又一次。提前致谢!

最佳答案

这是一个fiddle.

document.getElementById("id1").setAttribute(
       "style", "color: red; background-color: beige; padding-bottom: 2px; margin: 3px;");

关于javascript - 使用 JavaScript 添加多个样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36262756/

相关文章:

Javascript改变html元素的绝对位置

html - 3 列布局 HTML/CSS

javascript - 在两种不同的不透明度之间切换

javascript - 检测浏览器缩放级别

javascript - 如何仅使用 Onkeyup Javascript 获取特定列单元格值并对该值求和

html - 负边距顶部并向上滚动

jquery - 流入全日历事件?一个不可能的布局?图片包括

javascript - 如何使用 CSS(较少)

javascript - 从外部访问 Leaflet.js GeoJson 功能

javascript - 在运行时更改值