javascript - 数组排序后 style.display 发生变化

Question

我想在排序之前显示一条简单的加载消息，但在排序之后显示从无更改为阻止，即使我在之后调用排序也是如此。我什至尝试使用 setTimeout(2 秒)来更改显示，然后调用虚拟函数对内容进行排序。

function sort(i) {
    document.getElementById("loading").style.display = "block";
    array.sort(function(a, b) {
        return a[i].localeCompare(b[i]);
    });
}

Answer 1

当 JS 忙于工作时，浏览器不会急于重绘页面(假设可能还有其他 DOM 更改，它们应该一起批处理重绘)。

您需要释放事件循环以允许在两个语句之间进行重新绘制。

将对 array.sort 的调用移至函数中，并在延迟后调用它(例如使用 setTimeout 或 requestAnimationFrame)。