總覽
document
的 Document.readyState 屬性描述文件的讀取狀態。
數值
文件的 readyState 數值如下:
- loading
document
正在讀取中。- interactive
- 文件已經完成讀取和解析,但是其他的子資源,如「圖片樣式層次表」,仍然在讀取。這個狀態表示
DOMContentLoaded
事件已經被觸發。 - complete
- 文件及仔資源都完成讀取。這個狀態表示
load
事件已經被觸發。
當這個屬性的數值改變時, readystatechange
事件在 document
上觸發。
表達式
var string = document.readyState;
範例
不同的狀態
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
// alternative to DOMContentLoaded event document.onreadystatechange = function () { if (document.readyState == "interactive") { initApplication(); } }
readystatechange 替代 load
// alternative to load event document.onreadystatechange = function () { if (document.readyState == "complete") { initApplication(); } }
規範
規範 | 狀態 | 註 |
---|---|---|
WHATWG HTML Living Standard The definition of 'Document readiness' in that specification. |
Living Standard | |
HTML5.1 The definition of 'Document readiness' in that specification. |
Working Draft | |
HTML5 The definition of 'Document readiness' in that specification. |
Recommendation | Initial specification. |
參見
readystatechange
eventDOMContentLoaded
eventload
event