用JS控制CSS时，如何添加浏览器兼容前缀？

Question

现有一个<div id="aaa"><>
我想用JS给这个元素添加transition属性，并且加上webkit前缀，如下：
<div id="aaa" style="-webkit-transition:all 1s"><>

但是我用下列方法添加样式时，最终结果都是：
<div id="aaa" style="transition:all 1s"><>

所以我想知道在用JS控制CSS3属性时，如何添加webkit前缀（毕竟安卓或低版本浏览器对transform等属性支持不好。）

$('#aaa').css('WebkitTransition', 'all 1s');
$('#aaa').css('transition', 'all 1s');
$('#aaa').css('-webkit-transition', 'all 1s');
aaa.style['-webkit-transition'] = 'all 1s';
aaa.style['WebkitTransition'] = 'all 1s';
aaa.style.transition = 'all 1s';

Answer 1

使用题主的方法可能已经成功，但是在当前浏览器下它选择了样式“transition:all 1s” 所以在DOM中的行内样式只能看到“transition:all 1s”

用JS控制CSS
这里建议使用addclass的方法来添加样式。方便添加兼容而且不容易出错。

Answer 2

用setAttribute();