如何用javascript更改css属性？

Question

我尝试使用javascript更改div的margin-top css元素，但它无法正常工作。这是我的代码：

document.getElementById("sidescrollbtn").css({'margin-top':'70px'});

有什么想法吗？

小提琴： http://jsfiddle.net/vinicius5581/2y63xnxa/5/

Answer 1

在vanilla JS中，只需设置.style.{camelCasedProperty} = 'value';

即可

document.getElementById("sidescrollbtn").style.marginTop = '70px';

您也可以使用您尝试的对象表示法来使用jQuery：

$('#sidescrollbtn').css({ 'margin-top': '70px' });

Answer 2

你可以通过以下几种方式实现：

// Reference property name
document.getElementById("sidescrollbtn").style.marginTop = '70px';

OR

// Use setAttribute method
document.getElementById("sidescrollbtn").setAttribute("style", "margin-top: 70px");

OR

// Use jquery .css()
$('#sidescrollbtn').css({ 'margin-top': '70px' });

其他信息

• Element.setAttribute() on MDN
• css() on jQuery docs

Answer 3

使用 HTML DOM

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

<强> 实施例

<script>
document.getElementById("p2").style.color = "blue";
</script>

Answer 4

你可以使用

给css

document.getElementById("p2").style.color = "blue";

Answer 5

在您创建的JSFiddle中，如果您使用以下代码行替换有问题的代码行，这将有效。

document.getElementById("sidescrollbtn").style.marginTop = '70px';

您也可以使用jQuery来应用样式，如下所示

$('#sidescrollbtn').css({ 'margin-top': '70px' });