javascript - 在 javascript 处理卡住时显示 GIF 图像

Question

我正在构建一个应用程序，其中我正在执行一些冗长(10-15 秒)的 java 脚本。我想在执行过程中显示 gif 图像。我添加了一个 gif 加载图像，在我开始处理我的 javascript 之前，我将包含 gif 图像的 div 的样式设置为显示: block ，在完成 javascript 处理后，我将其设置回显示:无。我可以看到 gif 图像正在出现，但它没有显示动画。它被卡住了。这个 gif 是一个加载图标。

我的 javascript 函数看起来像这样

function jsFunc(){
// set the div containg the image to display:block
elmDivGif.style.display="block";

Here comes my operation which will take 10-15 secons to finish

// setting the image style to none
elmDivGif.style.display="none";
}

这种做法有什么问题吗？感觉gif动画和js都是在同一个线程运行，而且一次只能一个人使用。

请指教。

Answer 1

Gif 不会显示动画，因为浏览器渲染进程实际上在运行 javascript 代码的同一个线程中。为了实现您想要做的事情，您必须使用 Web Workers ，但请记住，并非所有浏览器都支持它。