javascript – 为什么我们不能使用for循环来创建动画?

前端之家收集整理的这篇文章主要介绍了javascript – 为什么我们不能使用for循环来创建动画?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在jQuery库和offset()方法的帮助下,通过编写这个简单的代码,元素将逐渐改变位置似乎是合乎逻辑的.
for (i = 0; i < 900; i = i + .5) { 
    $('#moving-element').offset({ top: i })
}

浏览器将停止一段时间并最终将元素移动到距离顶部900px的位置,不会观察到任何转换.出于好奇,我写了这个:

for (i = 0; i < 900; i = i + .5) { 
    $('#moving-element').offset({ top: i }); 
    console.log(i)
}

看到控制台正在输出连续的数字,但只有在for循环结束后它才会偏移元素.

为什么这不会在代码执行时逐渐完成?

解决方法

因为javascript是单线程事件建模的运行时(至少在当前的版本中).

这意味着在运行for循环时,没有其他任务可以运行.这意味着接受用户输入,更新屏幕等.因此循环完全运行,然后显示最终结果.

猜你在找的JavaScript相关文章