Document: thuộc tính readyState

switch (document.readyState) {
  case "loading":
    // Tài liệu đang tải.
    break;
  case "interactive": {
    // Tài liệu đã tải xong và chúng ta có thể truy cập các phần tử DOM.
    // Các tài nguyên con như tập lệnh, hình ảnh, stylesheet và frame vẫn đang tải.
    const span = document.createElement("span");
    span.textContent = "Phần tử <span>.";
    document.body.appendChild(span);
    break;
  }
  case "complete":
    // Trang đã tải đầy đủ.
    console.log(
      `Quy tắc CSS đầu tiên là: ${document.styleSheets[0].cssRules[0].cssText}`,
    );
    break;
}

// Phương án thay thế cho sự kiện DOMContentLoaded
document.onreadystatechange = () => {
  if (document.readyState === "interactive") {
    initApplication();
  }
};

// Phương án thay thế cho sự kiện load
document.onreadystatechange = () => {
  if (document.readyState === "complete") {
    initApplication();
  }
};

document.addEventListener("readystatechange", (event) => {
  if (event.target.readyState === "interactive") {
    initLoader();
  } else if (event.target.readyState === "complete") {
    initApp();
  }
});