3. 进度条（progress bar）

进度条这种反应进程的东西在我看来是很需要的，特别是当下载或者上传文件的时候，或者在线读取文件的时候。

但是，又有一个问题，前端还是后端来做呢？

前端

<div id="myprogress" class="progress">
        <div id="myBar" class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
</div>

function move() 
{
    var elem = document.getElementById("myBar"); 
    var width = 10;
    var id = setInterval(frame, 10);
    function frame() {
        if (width >= 100) {
            clearInterval(id);
            //elem.style.display="none";
        } else {
            width=width+5; 
            elem.style.width = width + '%'; 
            elem.innerHTML = width + '%';
        }
    }
    

写代码前，我们就有讨论过，将哪一变量用来监视进度。最后我们用了 readyState。因为他有4种状态，而且是依次变化，0到4。0表示开始，4表示完成。
大多数情况下，这个工作起来效果还行，但是源代码是这样的。

xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var myArr = JSON.parse(this.responseText);
        myFunction(myArr);
    }
};

也就是说，传输完成其实是有两个条件的，我们只监视了第一个条件，而大多数情况下this.status == 200的。所以说，这个是有风险的。即进度条已经完整，但是内容都出不来。

后端

问题讨论
问题解决方案

有人说，用总量除以速度；也有人说，在后台对任务进程进行监测；还有人说，动画代替（相当于没有进度条）；更搞笑的是，有人说只看什么时候任务完成，完成了，进度条自然就完整了。。。。笑死了。