在Javascript中回调元素的样式更改

Question

很抱歉我对Javascript的了解不多，但我真的想问一下： 我有一个以下的CSS规则：

.myClass {
    transition: .3s all;
 }

跟随<script>中的js：

[node].style.transform = "translateX(-100px)";
[node].className = "myClass";

// do stuffs for transition end event

我不明白为什么节点向左移动100px WITH 过渡效果。 Javascript代码逐行执行是不是真的？似乎setTimout（[callback]，10）确实解决了问题，但为什么呢？

Answer 1

  

我不明白为什么节点向左移动100px并带有过渡效果。 Javascript代码逐行执行是不是真的？

JavaScript逐行执行，但浏览器会在单独的线程中监视DOM的更改并批量更新。

转换完成后，transitionend事件将会触发。