javascript - 页面加载进度

Question

如何计算加载站点？我看到网站的状态正在加载，我知道有一个事件 upload.onprogress XMLHttpRequest 来上传:

XMLHttpRequest.upload.onprogress = function(event) {
  console.log( 'Uploaded ' + event.loaded + ' / ' + event.total );
} 

如何执行相同的操作，但要从服务器下载(加载)页面/数据？

Answer 1

有一个example在 MDN 上:

var oReq = new XMLHttpRequest();

oReq.addEventListener("progress", updateProgress);
oReq.addEventListener("load", transferComplete);
oReq.addEventListener("error", transferFailed);
oReq.addEventListener("abort", transferCanceled);

oReq.open();

// ...

// progress on transfers from the server to the client (downloads)
function updateProgress (oEvent) {
  if (oEvent.lengthComputable) {
    var percentComplete = oEvent.loaded / oEvent.total;
    // ...
  } else {
    // Unable to compute progress information since the total size is unknown
  }
}

function transferComplete(evt) {
  console.log("The transfer is complete.");
}

function transferFailed(evt) {
  console.log("An error occurred while transferring the file.");
}

function transferCanceled(evt) {
  console.log("The transfer has been canceled by the user.");
}