我有一个脚本将某些css样式应用于元素，然后向元素添加过渡样式，然后将另一个css样式应用于该元素。我要做的是让元素立即应用样式，然后为下一个更改设置动画。代码是基本的，只需设置样式，然后设置过渡样式，然后设置最终样式。但我正在经历第一个被更改的属性（没有转换的属性）正在应用过渡，即使我之前没有设置过渡属性。我仔细检查过该元素是否已经应用了过渡属性。这是为什么？
此外，如果我在应用第一个样式和转换之间留下50毫秒的延迟，它会按预期工作。
答案 0 :(得分：2)
在应用第一个样式后必须强制重新布局（因此在没有过渡的情况下处理它们）然后您可以应用导致过渡的样式。你现在的方式，所有的操作都被折叠成一个操作，因此一切都在进行转换。
获取重新布局的最简单方法是应用第一个CSS属性，然后执行setTimeout(fn, 1)以在计时器回调中应用第二组属性。还有其他方法可以通过请求触发重新布局的某些属性来强制重新布局。我不记得究竟哪些属性是我的头脑（需要一些研究）。
我自己没有尝试过，但我认为请求.offsetHeight元素的大小属性会强制重新布局。浏览器意识到存在待定样式更改，并且那些待定样式更改可能会影响大小请求，因此它会在返回.offsetHeight值之前同步重新布局，从而解决您的问题。