杨国忠的青草地

导航

网页加载状态进度条制作

前端请求资源,是通过document.onreadystatechange事件来获取页面加载状态改变,

以及通过document.readyState返回当前文档的状态

1.uninitialized-还未开始载入

2.loading -载入中

3.interactive - 已加载,文档与用户可以开始交互

4.complate-载入完成

根据进度条分类大概可分为三类,头部进度条,网页加载进度条,实时获取加载数据进度条

具体实现就是在页面先显示进度条,页面请求加载完成之后隐藏进度条

document.onreadystatechange = function(){

if(document.readyState == 'complate){

//进度条dom隐藏

}

}

loading.io可以自己制作好看的进度条。

posted on 2021-12-16 22:22  web杨国忠  阅读(306)  评论(0编辑  收藏  举报