如何在 JavaScript 中应用超过 1 种 CSS 样式？ [复制]答案

【问题标题】：How to apply more than 1 CSS styles in javaScript? [duplicate]如何在 JavaScript 中应用超过 1 种 CSS 样式？ [复制]
【发布时间】：2015-03-12 07:48:50
【问题描述】：

我想为按钮应用超过 1 种 CSS 样式（它的 id 是 name_button）。

这是我的 JavaScript 代码。

var name_button = document.getElementById('name_button');
name_button.style.display = 'block';
name_button.style.margin-left = '125px';
name_button.style.padding-right = '0px';

但是对于最后两行（name_button.style.margin-left = '125px'; 和 name_button.style.padding-right = '0px';）我的代码不起作用。

【问题讨论】：

您使用了错误的样式属性。请参阅此以正确命名w3schools.com/jsref/dom_obj_style.asp。
您可以设置一个具有属性的类，并在您单击时将一个类添加到该按钮。
使用如下 'name_button.style.marginLeft = '125px';' 'name_button.style.paddingRight = '0px';'
（使用 Chrome）如果您选择一个元素然后右键单击并选择“检查元素”，您将在元素检查器中选择该元素。如果您随后选择Properties 选项卡，然后打开列表中的第一项，您可以向下浏览到style 属性。打开显示元素具有的有效属性列表。您还可以使用这种方法来发现有关各种元素的其他类型的信息。如果您远离网络并且手边没有参考资料，这会很方便。

标签： javascript html css

【解决方案1】：

在 JavaScript 中，所有带有 - 的 css 值都是驼峰式的。所以：

name_button.style.margin-left = '125px';

变成：

name_button.style.marginLeft = '125px';

和

name_button.style.padding-right = '0px';

变成：

name_button.style.paddingRight = '0px';

【讨论】：

【解决方案2】：

试试这个

name_button.style.marginLeft = "50px";

【讨论】：