使用JavaScript更改以破折号开头的CSS属性

Question

我正在尝试使用通常的方法通过javascript更改css属性。 问题是基于Webkit的属性以破折号开头，从而使javascript无效。

document.getElementById('circle1').style.-webkit-animation = 'upDown 15s infinite';

我如何修改此代码才能有效。

Answer 1

参考这个问题 ：

test.style.webkitAnimationName = 'colorchange'; // you had a trailing space here which does NOT get trimmed
test.style.webkitAnimationDuration = '4s';

Answer 2

document.getElementById('circle1').style['-webkit-animation'] = 'upDown 15s infinite';

Answer 3

您可以使用.setAttribute() ：

document.getElementById('circle1').setAttribute("style", "-webkit-animation: upDown 15s infinite");