Document.readyState
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
io error: No such file or directory (os error 2) (/home/runner/work/yari/yari/mdn/translated-content/files/zh-tw/web/api/document/index.md)
document
的 Document.readyState
屬性描述文件的讀取狀態。
數值
文件的 readyState 數值如下:
- loading
-
document
正在讀取中。 - interactive
-
文件已經完成讀取和解析,但是其他的子資源,如「圖片樣式層次表」,仍然在讀取。這個狀態表示
DOMContentLoaded
事件已經被觸發。 - complete
-
文件及子資源都完成讀取。這個狀態表示
load
事件即將被觸發。
當這個屬性的數值改變時, readystatechange
事件在 document
上觸發。
表達式
js
var string = document.readyState;
範例
不同的狀態
js
switch (document.readyState) {
case "loading":
// 文件讀取中。
break;
case "interactive":
// 文件已經完成讀取。可以使用 DOM 元素。
var span = document.createElement("span");
span.textContent = "A <span> element.";
document.body.appendChild(span);
break;
case "complete":
// 頁面已經完成讀取。
console.log(
"The first CSS rule is: " + document.styleSheets[0].cssRules[0].cssText,
);
break;
}
readystatechange 替代 DOMContentLoaded
js
// alternative to DOMContentLoaded event
document.onreadystatechange = function () {
if (document.readyState == "interactive") {
initApplication();
}
};
readystatechange 替代 load
js
// alternative to load event
document.onreadystatechange = function () {
if (document.readyState == "complete") {
initApplication();
}
};
規範
Specification |
---|
HTML Standard # current-document-readiness |