通过纯JavaScript更新CSS。。。如果属性使用供应商前缀，如何更新？

例如，如果我想为我的光标创建一个抓取图标，在CSS中，我会使用：

div {
     cursor: -moz-grabbing;
     cursor: -webkit-grabbing;
     cursor: grabbing;
    }

但是，我想通过JavaScript实现这一点，但仍然能够涵盖这三个方面，我该怎么做？我是否只在三行中分配它们——JavaScript是否回退到上一个分配

document.getElementById('theDiv').style.cursor = '-webkit-grabbing';
document.getElementById('theDiv').style.cursor = '-moz-grabbing';
document.getElementById('theDiv').style.cursor = 'grabbing';

1） 可以为此目的添加一个类，该类指定所有属性

2） 如果您按自己的方式尝试，Javascript将重新分配属性3次，最后一次执行的属性将作为活动属性，因此

    document.getElementById('theDiv').style.cursor = '-webkit-grabbing';
    document.getElementById('theDiv').style.cursor = '-moz-grabbing';
    document.getElementById('theDiv').style.cursor = 'grabbing';

这是行不通的

3） 添加一个类就可以了。例如：

    css:-
    .myClass {
      cursor: -moz-grabbing; 
      cursor: -webkit-grabbing; 
      cursor: grabbing; 
     }

及

---

否，Javascript将重新分配属性3次，最后一次作为活动属性执行

您要做的是检测您正在使用的javascript浏览器，然后应用适当的浏览器

在一天结束时，您的JS将在用户的特定机器上使用特定浏览器执行，因此，通过检测浏览器并为该浏览器应用适当的样式，您可以解决问题

比苏多代码：

if(isMozilla) {
    document.getElementById('theDiv').style.cursor = '-moz-grabbing';
}
else if(isChrome OR isSafari) {
    document.getElementById('theDiv').style.cursor = '-webkit-grabbing';
}
else {
    document.getElementById('theDiv').style.cursor = 'grabbing';
}

---

在这方面最好知道：如果您试图设置一个无效值，浏览器将忽略它。所以类似这样的方法是有效的：

function setStyle(element, property, value) {
    var prefix = ['', '-webkit-', '-moz-'];
    var i = 0;
    var style = element.style;
    do {
        style[property] = prefix[i] + value;
        i += 1;
    }
    while(style[property] !== prefix[i] + value && i < prefix.length);
}

函数集合样式（元素、属性、值）{
变量前缀=[''，'-webkit-'，'-moz-']；
var i=0；
var style=element.style；
做{
样式[属性]=前缀[i]+值；
i+=1；
}
while（style[property]！==prefix[i]+value&&i

好的方面实际上，你可以有这样的东西：

.myClass{cursor:-moz-grabbing；cursor:-webkit-grabbing；cursor:grabbing；}

然后在你的JS:

document.getElementById（'theDiv'）.className+='myClass'

如果每个供应商都设置了一个像isMozilla这样的唯一变量，那么这不是很好吗？因此我们不必推断它。Naeem Shaikh的解决方案是最好的，依我看，但您可以使用

cssText

属性：这与

css3

无关。编辑。请看下面我的答案检查这个和这个。

function setStyle(element, property, value) {
    var prefix = ['', '-webkit-', '-moz-'];
    var i = 0;
    var style = element.style;
    do {
        style[property] = prefix[i] + value;
        i += 1;
    }
    while(style[property] !== prefix[i] + value && i < prefix.length);
}