为什么我的 javascript 代码不能从上到下编码?
https://jsfiddle.net/p47f6Lcy/1/ https://jsfiddle.net/p47f6Lcy/1/
按下时使用我的代码id="test"
为什么还是alert
改变前backgroundColor
and translate3d
看看我的代码应该改变backgroundColor
and translate3d
调用前函数test2_fn
我该如何改变backgroundColor
and translate3d
着火之前alert
?
..
<div id="test" onclick="test_fn()">
CLICK
</div>
<script>
function test_fn(){
document.getElementById("test").style.backgroundColor = "red";
document.getElementById("test").style.transform = "translate3d(500px, 0px, 0px)";
test2_fn();
}
function test2_fn(){
alert("555");
}
</script>
As nnnnnn https://stackoverflow.com/users/615754/nnnnnn评论中提到:
因为浏览器在当前JS执行完毕之前不会重新绘制屏幕。所以元素样式已经在 DOM 中更新了,只是你还没有看到而已。
如果您确实想这样做,可以将其他函数的执行推迟到事件循环中的下一个周期。你可以简单地使用setTimeout(test2_fn, 0)
.
工作小提琴 https://jsfiddle.net/2Lq9326c/
This http://timnew.me/blog/2014/06/23/process-nexttick-implementation-in-browser/也是一本好书。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)