我可以回答 jQuery。如果您谈论的是文档加载,您可以在两个主要时间点收到通知:
当 DOM 已被解析并且现在可以安全操作时(但页面中的某些资源可能尚未完成加载,例如图像)。
当 HTML 文件中明确声明的所有资源都已加载时(如图像,但不是 iframe)。有多种方法可以为这两个事件中的每一个注册通知。
对于事件 #2,这两个事件在 HTML 文件中静态声明的所有资源(脚本、样式表、图像等)完成加载(不包括 iframe 内容)时同时触发。
$(window).load(function()
<body onload="load()">
接下来的两个也是相同的,但只是声明同一事件的不同方式,在现代浏览器中,这些是由 DOMContentLoaded 事件触发的,该事件发生在上述事件之前,MDN 描述如下:
$(document).ready()
$(function(){...});
DOMContentLoaded 由 MDN 描述:
DOMContentLoaded 事件在文档被加载时触发
完全加载和解析,无需等待样式表、图像、
和子帧完成加载(加载事件可用于检测
一个完全加载的页面)。
仅供参考,在不生成DOMContentLoaded 事件的旧浏览器中,当document.readyState === "complete" 时,这些函数将在onreadystatechange 通知上被调用,而在一个非常旧的浏览器中,它可能在window.onload 发生之前不会被触发.
如果您查看浏览器内部结构,浏览器会保留一个 document.readyState 变量。它的可能值为"loading"、"interactive" 和"complete"。
"loading" 的意思是它正在加载页面。
"interactive" 的意思是 HTML 已经被解析,但是一些子资源(除了图片)仍在加载中(可能是样式表或脚本)
"complete" 表示文档已加载完毕(图片和 iframe 除外)
因此,可以在 jQuery 中公开这些其他加载事件。但是(这是个大问题),唯一能在所有浏览器中一致工作的状态是"complete" 状态。 "interactive" 可能意味着您拥有一个完全解析的 DOM,即使尚未加载样式表之类的东西,您也可以开始更改 DOM,但事实证明它在 IE 中太容易出错了甚至值得尝试将其用作 jQuery 开发历史的展示。
jQuery 还有另一种风格的.load(),它使用 ajax 将新内容加载到与初始页面加载无关的给定 DOM 对象中:
$("#content").load("some url", completionFn);
这由你调用并立即触发一个 ajax 函数来检索你给它的 URL 返回的任何内容。然后该内容将被插入到 jQuery 对象中的 DOM 元素中,当该操作完成时,将调用 completionFn。
而且,.load() 也可用于监控何时加载特定资源。这主要用于图像:
var img = $("<img>");
img.load(function() {
// called when the image finishes loading
});
img.attr("src", "http://example.com/myimage.jpg");