//文档状态的变化
//document是文档
//document.documentElement 是DOM树文档
document.onreadystatechange = function () {
console.log(document.readyState);
}
/**
* onload 属性在文档对象加载完成后触发。
* onload 通常使用于 <body> 元素中,用于在页面完全载入后执行指定的脚本(包括图片,脚本,css文件等)。
* onbeforeunload 事件在即将离开当前页面(刷新或关闭)时触发。
* onunload
* 页面加载时只执行onload
*页面关闭时先执行onbeforeunload,最后onunload
*页面刷新时先执行onbeforeunload,然后onunload,最后onload。
* */
/**
* 当初始的 HTML 文档被完全加载和解析完成之后,
* DOMContentLoaded 事件被触发,而无需等待样式表、图像和子框架的完成加载。
* 另一个不同的事件 load 应该仅用于检测一个完全加载的页面。
* 在使用 DOMContentLoaded 更加合适的情况下使用 load 是一个令人难以置信的流行的错误,所以要谨慎。
* document.addEventListener("DOMContentLoaded", function(event) {
* console.log("DOM fully loaded and parsed");
*});
*/
//document.readyState == complete 与 onload事件出发状态是是一致地,都是页面全部加载好
document.addEventListener("DOMContentLoaded", function (event) {
console.log("DOM fully loaded and parsed");
});
$(document).ready(function () {
console.log("jquery ready is Ok")
});
以下是控制台输出
interactive
jquery ready is Ok
DOM fully loaded and parsed
complete
load is Ok