原生Javascript HTML5进度条缓慢加载/动画

Question

我使用HTML5创建了进度条，如下所示。

<progress id="prog" max="100" value="0" > </progress> <br/>

对于动画我正在使用CSS和Javascript。出于某种原因，我不想使用外部JS库。我已经完成了大部分工作，唯一的问题是，当我使用JS设置进度值时，它会快速更新，这显然是为什么。但是我希望它看起来慢得慢并且有一些延迟，所以例如在一些按钮按下值从0％到20％所以我想使用一些功能/机制，所以进度条缓慢更新。