用JS检测页面加载的不同阶段状态
这可以通过用document.onreadystatechange的方法来监听状态改变, 然后用document.readyState == “complete”判断是否加载完成。
可以采用2个div,其中一个在前面,一个在后面,前面的先显示,里面放一个页面正在加载中的小图片,小flash都可以。
后面的div开始加载内容,在页面上随时监测加载是否完毕,如果加载完毕,将前面的div隐藏,后面的div提到前面来即可。

document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法.
function subSomething()
{
if(document.readyState == “Loaded”) //当页面加载状态
{
//Load提示第一个div隐藏掉
//将Html显示
}


页面加载readyState的五种状态 原文如下:
0: (Uninitialized) the send( ) method has not yet been invoked.
0 - (未初始化)还没有调用send()方法
1: (Loading) the send( ) method has been invoked, request in progress.
1 - (载入)已调用send()方法,正在发送请求
2: (Loaded) the send( ) method has completed, entire response received.
2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
3: (Interactive) the response is being parsed. 4: (Completed) the response has been parsed, is ready for harvesting.
3 - (交互)正在解析响应内容 4: (Completed) the response has been parsed, is ready for harvesting.
4 - (完成)响应内容解析完成,可以在客户端调用了
用JS检测页面加载的不同阶段状态的更多相关文章
- js jquery 页面加载初始化方法
js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...
- 转:JS线程和JS阻塞页面加载的问题
前几日写了一篇文章,介绍了js阻塞页面加载的问题.当时是通过例子来验证的.今天,我介绍一下浏览器内核,从原理上介绍一下js阻塞页面加载的原因. 浏览器的内核是多线程的,它们在内核制控下相互配合以保持同 ...
- JS判断页面加载完毕
//JS判断页面加载完毕,再隐藏加载效果层,一个简单的JS加载效果. document.onreadystatechange = function () { if (document.readySta ...
- JS实现页面加载完毕之前loading提示效果
1.获取浏览器页面可见高度和宽度 var _PageHeight = document.documentElement.clientHeight, _PageWidth = document.docu ...
- 解决JS文件页面加载时的阻塞
关于页面加载时的时间消费,许多书中都做出了介绍,也提出了很多种方法.本文章就详细介绍XHR注入. 概述:JS分拆的方法 1.XHR注入:就是用ajax异步请求同域包含脚本的文件,然后将返回的字符串转化 ...
- js中页面加载完成后执行的几种方式及执行顺序
1:使用jQuery的$(function){}; 2:使用jquery的$(document).ready(function(){});前两者本质上没有区别,第1种是第2种的简写方式.两个是docu ...
- js判断页面加载完毕方法
判断页面加载完成这个方法是很常见的,下面有三个常用的方法,各有利弊. 一.纯js方法 // (1).页面所有内容加载完成执行 window.onload = function(){ } // (2). ...
- JS在页面加载之后运行
通用的页面加载后再运行JS有两种方式:1.在DOM加载完毕后,页面全部内容(如图片等)完全加载完毕前运行JS. 2.在页面全部内容加载完成(包括引用文件,图片等)之后再加载JS 1.在DOM加载后 ...
- js中页面加载完成后执行的几种方法及执行顺序
在js和jquery使用中,经常使用到页面加载完成后执行某一方法.通过整理,大概是五种方式(其中有的只是书写方式不一样). 1:使用jQuery的$(function){}; 2:使用jquery的$ ...
随机推荐
- IDEA maven dependency自动提示
通过File->setting->maven->repositories,选择本地仓库,点击右上角更新,更新maven仓库索引 在pom.xml编写引入依赖的jar包时,已经下载到本 ...
- poj 1258 Agri-Net 解题报告
题目链接:http://poj.org/problem?id=1258 题目意思:给出 n 个 farm,每个farm 之间通过一定数量的fiber 相连,问使得所有farm 直接或间接连通的 最少 ...
- html5--6-55 动画效果-关键帧动画
html5--6-55 动画效果-关键帧动画 实例 @charset="UTF-8"; div{ width: 150px; height: 150px; font-size: 2 ...
- python中optparse模块用法
optparse模块主要用来为脚本传递命令参数,采用预先定义好的选项来解析命令行参数. 首先需要引入optparser模块,然后执行初始化,实例化一个OptionParser对象(可以带参,也可以不带 ...
- Unable to instantiate receiver XXXXXX
运行一个工程的时候时logcat中出现了“Unable to instantiate receiver XX..”. 检查后发现,由于是东拼西凑的代码,所以在Manifest文件里注册了Receive ...
- 字符串转UTF-8码(%开头)
var str = '中'; var code = encodeURI(str); console.log(code); // => %E4%B8%AD
- Watir 能够为你做什么?
为了提高自己的工作效率,我曾经对Watir进行了系统性的学习,比起学习C++, Java等始终不得门,Watir还是学进去了,能够完整搭建出一个自己很容易理解的自动化架构. 之后我想继续在自动化测试方 ...
- bzoj 4756 Promotion Counting —— 线段树合并
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4756 合并子树的权值线段树: merge 返回 int 或者是 void 都可以. 代码如下 ...
- @font-face 用fontsquirrel把ttf文件获取别的文件格式
@font-face是css3的一个模块,但是@font-face这个功能早在IE4就支持了,他主要是把自己定义的Web字体嵌入到你的网页中, @font-face { font-family: &l ...
- UVa 1336 Fixing the Great Wall (区间DP)
题意:给定 n 个结点,表示要修复的点,然后机器人每秒以 v 的速度移动,初始位置在 x,然后修复结点时不花费时间,但是如果有的结点暂时没修复, 那么每秒它的费用都会增加 d,修复要花费 c,坐标是 ...