Javascript 在循环中显示HTML元素

我试图在循环运行时显示HTML元素，不幸的是，我的方法似乎不起作用：

function main函数（）{
$（“#myElement”）.removeClass（'hidden'）；
$（'div.otherElements'）。每个（函数（）{
doSomething（）；
});
$（'#myElement'）.addClass（'hidden'）；
}

removeClass（）

和

addClass（）

调用本身工作正常，循环也工作正常。我的怀疑是，循环在

.removeClass（）

调用完成之前就开始了，而调用一直等到循环结束，因此它从未真正显示在屏幕上，因为

.removeClass（）

和

.addClass（）

几乎同时发生。如果我使用

console.log（）

而不是jquery调用，它将显示相同的行为。调用

main function（）

时，在循环完成之前，第一个

.console.log（）

不会显示

---

我已经尝试将循环放入另一个函数中，但这没有改变任何东西。

在调用堆栈为空之前，对类列表的更改不会生效。您可以在超时为0的情况下强制执行此操作。这个例子很笨拙，但可以完成任务

功能暂停（毫秒）{
var dt=新日期（）；
而（（新日期（））-dt{
$（'div.otherElements'）。每个（函数（）{
doSomething（）；
});
$（'#myElement'）.addClass（'hidden'）；
}, 0);
}
main函数（）
。隐藏{
显示：无；
}

执行重要工作
在调用堆栈为空之前，对类列表的更改不会生效。您可以在超时为0的情况下强制执行此操作。这个例子很笨拙，但可以完成任务


功能暂停（毫秒）{
var dt=新日期（）；
而（（新日期（））-dt{
$（'div.otherElements'）。每个（函数（）{
doSomething（）；
});
$（'#myElement'）.addClass（'hidden'）；
}, 0);
}
main函数（）
。隐藏{
显示：无；
}

做重要的工作
如果使用
setTimer
调用循环，而不是直接调用循环，该怎么办？Javascript运行速度非常快。javascript不会等到浏览器有机会重新绘制之后再继续其逻辑。很可能在浏览器有机会执行重画/回流之前，您的逻辑已经完成，因此您没有看到效果。正如@Taplar所说，您是否验证了
doSomething（）
花费的时间足够长，以至于
#myElement
可以看到足够长的时间以引起注意？如果在循环中添加一个警报，迫使js停止，直到每次点击ok，那么可以看到它是否工作。如果你能在警报启动时看到你的元素，那么js很可能只是运行得太快了。不，它不是太快，循环需要一段时间（大约3-5秒），这就是我希望元素显示动画的原因，因此用户知道它正在工作。如果您使用
setTimer
调用循环，而不是直接调用它，该怎么办？Javascript运行速度非常快。javascript不会等到浏览器有机会重新绘制之后再继续其逻辑。很可能在浏览器有机会执行重画/回流之前，您的逻辑已经完成，因此您没有看到效果。正如@Taplar所说，您是否验证了
doSomething（）
花费的时间足够长，以至于
#myElement
可以看到足够长的时间以引起注意？如果在循环中添加一个警报，迫使js停止，直到每次点击ok，那么可以看到它是否工作。如果你能在警报启动时看到你的元素，那么js很可能只是运行得太快了。不，它不是太快，循环需要一段时间（大约3-5秒），这就是为什么我希望元素显示动画，以便用户知道它正在工作。希望我想到这一点，虽然为什么要使用
setTimeout
在结尾隐藏元素？@ScottHunter当时这似乎是个好主意，但你是对的，可能不需要。用一个工作示例更新了答案。还有@ScottHunter，你是对的。隐藏元素的超时时间不需要。@korguell如果答案符合您的喜好，请您将其标记为已接受的答案好吗？希望我能想到这一点，尽管您为什么要在最后使用
setTimeout
隐藏元素？@ScottHunter当时似乎是个好主意，但您是对的，可能不需要。用一个工作示例更新了答案。还有@ScottHunter，你是对的。不需要隐藏元素的超时。@korguell如果答案符合您的喜好，请将其标记为已接受答案？