用js判断页面是否加载完成-优快云博客

本文介绍了一种使用JavaScript和jQuery来监测网页加载状态的方法，并详细解释了如何通过改变HTML和body元素的display属性来隐藏页面直到加载完成。同时，还提供了关于页面加载readyState的五种状态的说明。

说明：先将html，body的display属性设置成none，然后给加载状态赋予一个执行函数，执行函数中写状态监听代码

//前提，先引入jquery
$("html body").css("display","none");
//监听加载状态改变
document.onreadystatechange = completeLoading;

//加载状态为complete时移除loading效果
function completeLoading() {
    if (document.readyState == "complete") {
       //下面是状态为complete时，执行自己的代码，我的需求是把html , body显示出来
        $("html body").css("display","block");
    }
}

页面加载readyState的五种状态

0: Uninitialized 未初始化，还没有调用send()方法

1: Loading 载入，已调用send()方法，正在发送请求

2: Loaded 载入完成，send()方法执行完成，已经接收到全部响应内容

3: Interactive 交互，正在解析响应内容

4: Completed 完成，响应内容解析完成，可以在客户端调用了

posted on 2017-07-07 09:35 小猴子先生阅读( ...) 评论( ...) 编辑收藏

转载于:https://www.cnblogs.com/guoyinli/p/7130453.html