如图所示：
这里暂时不考虑页面布局等方面，纯进度条加载的实现。
具体代码如下：
<p style="text-align:center;"> 页面载入中，请稍后...</p> <form name="loading"> <input type="text" name="progress" size="46" style=" font-family:Arial, Helvetica, sans-serif;font-weight:bolder; border-style:none; padding:0px;" /> <br /> <br /> <input type="text" name="per" size="36" style="font-weight:bolder; border-style:none; padding:0;" /> </form> <script type="text/javascript"> var bar=0; //进度条的进度 var line="||"; //类似进度条的符号 双竖线 var typeline="||"; count(); function count(){ bar =bar+2; //进度条+2 typeline=typeline+line; //符号随着增加 document.loading.progress.value=typeline; //显示进度条符号 document.loading.per.value=bar+"%"; //显示进度百分比 if(bar<100){ //判断进度条是否到头 setTimeout("count()",100); //设置定时 每隔100ms }else{ window.location="#"; //进度条到头后事件处理 } } </script>
此进度条为使用符号（||）呈现进度条的不断变化，此例重点是进度条的布局，此例可用于很普通的页面加载，无法计算真正的加载时间。
IT技术资料分享-个人整理自互联网