浏览 5519 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
---|---|
作者 | 正文 |
发表时间:2008-04-09
针对这个问题,一些JS框架提供了一些补充方法。如:jquery的$(document).ready()、mootools的domready事件。都是在页面的DOM加载完毕后立即执行,而不需要等待漫长的图片下载过程。 如果不使用这些框架,怎样实现自己的 document ready呢?请看以下一段代码: function __clear(timer){ clearTimeout(timer); clearInterval(timer); return null; }; function __attach_event(evt, callback) { if (window.addEventListener) { window.addEventListener(evt, callback, false); } else if (window.attachEvent) { window.attachEvent("on" + evt, callback); } } function __domReady(f) { // 假如 DOM 已经加载,马上执行函数 if (__domReady.done) return f(); // 假如我们已经增加了一个函数 if (__domReady.timer) { // 把它加入待执行函数清单中 __domReady.ready.push(f); } else { // 为页面加载完毕绑定一个事件, // 以防它最先完成。使用addEvent(该函数见下一章)。 __attach_event("load", __isDOMReady); // 初始化待执行函数的数组 __domReady.ready = [f]; // 尽可能快地检查DOM是否已可用 __domReady.timer = setInterval(__isDOMReady, 100); } } function __isDOMReady() { // 如果我们能判断出DOM已可用,忽略 if (__domReady.done) return false; // 检查若干函数和元素是否可用 if (document && document.getElementsByTagName && document.getElementById && document.body) { // 如果可用,我们可以停止检查 __clear(__domReady.timer); __domReady.timer = null; // 执行所有正等待的函数 for ( var i = 0; i < __domReady.ready.length; i++ ) { __domReady.ready[i](); } // 记录我们在此已经完成 __domReady.ready = null; __domReady.done = true; } } 具体的调用方法: __domReady(function() { alert("The dom is loaded!"); }); 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |
发表时间:2008-08-22
呵呵 这个东西好 谢谢 解决了我个问题
|
|
返回顶楼 | |