javascript - 有没有一种方法可以批量应用多种CSS样式以避免多次重排？

我知道直接通过JavaScript更改元素的样式会导致重排。但是，我想知道是否可以仅通过一次重排就批量更改多个样式值？

最佳答案

不是直接的，但是这里有一些很好的建议可以最大程度地减少回流的影响:

http://dev.opera.com/articles/view/efficient-javascript/?page=3

简而言之，尝试这样的事情:

var posElem = document.getElementById('animation');
var newStyle = 'background: ' + newBack + ';' +
  'color: ' + newColor + ';' +
  'border: ' + newBorder + ';';
if( typeof( posElem.style.cssText ) != 'undefined' ) {
  posElem.style.cssText = newStyle; // Use += to preserve existing styles
} else {
  posElem.setAttribute('style',newStyle);
}