页面加载状态

Question

有没有什么办法可以知道浏览器加载页面多远？

通过使用JavaScript或浏览器本机功能。

基于页面状态我想建立进度条。

Answer 1

我不是100％肯定这会工作，但..这里是理论：

首先，不停止的JavaScript运行，直到页面加载。含义，不要使用window.ready的document.ready等。

在页面的顶部初始化JavaScript变量称为加载或东西，它设置为0。

var loaded = 0;

整个页面增量加载在不同的点上，您认为它们的比例是正确的。

例如，在您认为一半的页面已被载入代码集loaded = 50;之后。

等..

正如我所说，这只是一个概念。

Answer 2

你必须亲自确定它，要做到这一点，你必须有一种方法来确定它。一种可能性是在页面上有虚拟元素，知道它们的总数，并且在每个点上计数已经存在的数量。但是这只会让你获得DOM的数量，并且可能只是加载时间的一小部分 - 通常情况下，浏览器无法等待脚本和图像。

Answer 3

代码：

function request() { 
    showLoading(); //calls a function which displays the loading message 

    myRequest = GetXmlHttpObject(); 
    url = 'path/to/script.php'; 
    myRequest.open('GET',url,true); 
    myRequest.onreadystatechange = function() { 
     if(myRequest.readyState == 4 && myRequest.status == 200) { 
      clearLoading(); //calls a function which removes the loading message 

      //show the response by, e.g. populating a div 
      //with the response received from the server 
     } 
    } 
    myRequest.send(null); 
} 

在请求开始的时候我打电话showLoading()它使用JavaScript动态添加preLoaderDiv的等价物。然后，当收到回复时，我会拨打clearLoading()，这会动态删除相应的preLoaderDiv。