Question

我有一个简单的JavaScript问题。我想显示一个html div 2秒。我尝试了下面的代码，但是在执行时我的div没有显示我的div 2秒钟。

//show my element
document.getElementById("alertProg").style.display=block;

//wait
var ms=2000;
ms += new Date().getTime();
while (new Date() < ms){}

我该如何解决这个问题？

编辑：问题不仅仅是在一个时间延迟，但如果我在更改显示值之间调用一个函数，则div无法正确显示。例如：

document.getElementById("alertProg").style.display='block';
myFunction();
document.getElementById("alertProg").style.display='none';

结果myFunction被执行但是alertProg总是被隐藏。

Answer 1

您应该使用setTimeout：

var div = document.getElementById('alertProg');
var ms = 2000;

div.style.display = 'block';
setTimeout(function(){
   div.style.display = 'none';
},ms);

Answer 2

您可以使用setTimeout函数。它有两个参数。第一个是你的功能，另一个是时间（ms）。当定义了时间时，函数将运行。

More details here

var ms = 2000;
document.getElementById("alertProg").style.display='block';
setTimeout(function(){
    document.getElementById("alertProg").style.display='none';
},ms);

javascript执行事件顺序

2 个答案: