引用了zepto框架,
代码1:
$('#button').click(function () {
$('.block').show();
alert('a')
});
运行结果是先alert然后block再显示出来。
然后代码做了改进,加了延迟
代码2:
$('#button').click(function () {
$('.block').show();
setTimeout(function(){
alert('a')
},0)
});
这时候才是正常顺序,请问为什么会这样?
之前也看到了相关的解释:大致就是浏览器是根据功能分线程的,比如图形绘制和js是不同的线程。(在这里可以理解为show是异步的)
对于代码一:JS顺序执行show,再执行alert,(最后执行show的显示)。但是show是给图形线程去绘制需要耗时,相当于异步了
对于代码二:settimeout也是异步,所以变成执行show代码,执行setimeout开一个线程,执行show的渲染,最后执行settimeout中的方法也就是alert