html网页下拉进度条变化,JS实现批量生成时显示滚动进度条和百分数

正 文：

在后台进行批量生成静态HTML时，您可能有这样的需求，需要实时显示整个过程的进度和滚动进度条。您当然可以利用ASP、PHP、Aspx等动态脚本语言实现这样的需求，但是这么做是有缺陷的，在循环生成的过程中，CPU将会一直被占用，而且可能同时产生大量的数据请求。

比如这样的批量ASP生成脚本：

for id= min to max

response.write ""

next

%>

上面的脚本缺点是：同时请求了大量的页面，很容易造成本地客户端或服务器的通信阻塞，可能发生连接请求被拒绝的情况。

下面飘易设计一种利用js+ajax的方式实现无刷新的批量生成并显示进度条和百分数的方式。飘易以实例说明，本项目共有2个文件：1.html和1.asp(模拟动态生成页面)。

在批量生成的过程中，我们不能简单用循环的方式比如 for 、while来实现。因为javascript是单线程，如果使用了循环，那么在生成的过程中，就不会逐条地实时显示进度，而是等全部生成html后，才会一次性显示。这样，就背离了我们的设计初衷。

关键是利用js的 setInterval定时器函数。

1.html源码如下：

后台 test

body{

fo