前端实现百分比进度条

随着html5的普及，各种css3动画及js特效在网页中也是层出不穷，PC端加载数据的速度还是比较快的，但是对于移动端设备而言则相对要慢不少，如果图片或者脚本没有加载完，用户在操作中就可能发生各种问题，因此我们需要对数据加载进行侦测，以更加人性化的方法将网页程序内容展现给用户，实现更佳的用户体验。

1.定时器实现进度条
优点:解决大部分加载进度问题
缺点:一旦有了缓存，定时器加载就变得鸡肋了

    <script>
        $(function () {
            //可使用jquery动态添加遮罩及loading效果
            // var loading = '<div class="loading"><div class="pic"></div></div>';
            //$("body").append(loading);
            //启动一个定时器
            setInterval(function(){
                $(".loading").fadeOut();//3秒之后影藏
            },3000)
        })

2.  通过加载状态事件制作进度条

• 1.document.onredystatechange 页面加载状态改变时的事件
• 2.document.readyState 返回当前文档的状态
• • 1.uninitialized 还未开始载入
• <