【发布时间】:2011-03-26 17:15:28
【问题描述】:
我需要等待我的 JavaScript 中的文档准备就绪,以便在正文底部插入一个 div。
我想:
- 使这个 JavaScript 文件尽可能小(如果可能,将其编译到
- 在闭包中内联提供文档就绪性的代码(不导出它)
在我的文件中内联整个 jQuery 源会太大,所以我正在寻找其他方法。 window.onload 可以,但我特别希望文档准备就绪,而不是等待 window.onload 事件。
有谁知道可以做到这一点的 JS sn-p 吗?还是我应该只复制 jQuery 的部分源代码?
编辑:
我设法爬取了 jQuery 源代码并与以下 sn-p 放在一起:
var ready = (function () {
var ready_event_fired = false;
var ready_event_listener = function (fn) {
// Create an idempotent version of the 'fn' function
var idempotent_fn = function () {
if (ready_event_fired) {
return;
}
ready_event_fired = true;
return fn();
}
// The DOM ready check for Internet Explorer
var do_scroll_check = function () {
if (ready_event_fired) {
return;
}
// If IE is used, use the trick by Diego Perini
// http://javascript.nwbox.com/IEContentLoaded/
try {
document.documentElement.doScroll('left');
} catch(e) {
setTimeout(do_scroll_check, 1);
return;
}
// Execute any waiting functions
return idempotent_fn();
}
// If the browser ready event has already occured
if (document.readyState === "complete") {
return idempotent_fn()
}
// Mozilla, Opera and webkit nightlies currently support this event
if (document.addEventListener) {
// Use the handy event callback
document.addEventListener("DOMContentLoaded", idempotent_fn, false);
// A fallback to window.onload, that will always work
window.addEventListener("load", idempotent_fn, false);
// If IE event model is used
} else if (document.attachEvent) {
// ensure firing before onload; maybe late but safe also for iframes
document.attachEvent("onreadystatechange", idempotent_fn);
// A fallback to window.onload, that will always work
window.attachEvent("onload", idempotent_fn);
// If IE and not a frame: continually check to see if the document is ready
var toplevel = false;
try {
toplevel = window.frameElement == null;
} catch (e) {}
if (document.documentElement.doScroll && toplevel) {
return do_scroll_check();
}
}
};
return ready_event_listener;
})();
// TEST
var ready_1 = function () {
alert("ready 1");
};
var ready_2 = function () {
alert("ready 2");
};
ready(function () {
ready_1();
ready_2();
});
非常感谢您帮助我在 jQuery 源代码中找到它。我现在可以将所有这些放在一个闭包中并完成我的工作,而无需导出任何函数并污染全局范围。
【问题讨论】:
-
您可以从 Google 的服务器获取 jQuery 源代码,这样您就可以很好地更改它已经被缓存了。
标签: javascript jquery