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

Question

例如,如果我想要一个抓取我的光标图标,在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';

Answer 1

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; 
     }

和

   js:-

   document.getElementById('theDiv').className += 'myClass';