常州市建设银行网站,打米传奇手游,做数字艺术设计的网站,百度站长提交网址浏览器加载页面的顺序#xff1a;
1、 解析HTML结构
2、 加载外部脚本和样式表文件
3、 解析并执行脚本代码
4、 构造HTML DOM模型ready()
5、 加载图片等组件
6、 页面加载完毕onload()
ready事件是在DOM模型构造完毕时触发
load事件是在页面加载完毕后触发 function…浏览器加载页面的顺序
1、 解析HTML结构
2、 加载外部脚本和样式表文件
3、 解析并执行脚本代码
4、 构造HTML DOM模型ready()
5、 加载图片等组件
6、 页面加载完毕onload()
ready事件是在DOM模型构造完毕时触发
load事件是在页面加载完毕后触发 function ready(fn) {
if (document.addEventListener) {
document.addEventListener(DOMContentLoaded, function () {
//注销事件, 避免反复触发
document.removeEventListener(DOMContentLoaded, arguments.callee, false);
fn(); //执行函数
}, false);
} else if (document.attachEvent) { //IE
document.attachEvent(onreadystatechange, function () {
if (document.readyState complete) {
document.detachEvent(onreadystatechange, arguments.callee);
fn(); //函数执行
}
});
}
};
ready()加强版 /*
* 传递函数给whenReady()
* 当文档解析完毕且为操作准备就绪时函数作为document的方法调用
*/
var whenReady (function () { //这个函数返回whenReady()函数
var funcs []; //当获得事件时要运行的函数
var ready false; //当触发事件处理程序时,切换为true
//当文档就绪时,调用事件处理程序
function handler(e) {
if (ready) return; //确保事件处理程序只完整运行一次
//如果发生onreadystatechange事件但其状态不是complete的话,那么文档尚未准备好
if (e.type onreadystatechange document.readyState ! complete) {
return;
}
//运行所有注册函数
//注意每次都要计算funcs.length
//以防这些函数的调用可能会导致注册更多的函数
for (var i 0; i funcs.length; i ) {
funcs[i].call(document);
}
//事件处理函数完整执行,切换ready状态, 并移除所有函数
ready true;
funcs null;
}
//为接收到的任何事件注册处理程序
if (document.addEventListener) {
document.addEventListener(DOMContentLoaded, handler, false);
document.addEventListener(readystatechange, handler, false); //IE9
window.addEventListener(load, handler, false);
} else if (document.attachEvent) {
document.attachEvent(onreadystatechange, handler);
window.attachEvent(onload, handler);
}
//返回whenReady()函数
return function whenReady(fn) {
if (ready) { fn.call(document); }
else { funcs.push(fn); }
}
})();
//--------------------- test -----
function t1() {
console.log(t1);
}
function t2() {
console.log(t2);
}
// t2-t1-t2
whenReady(t1);
t2();
whenReady(t2);
更多专业前端知识请上
【猿2048】www.mk2048.com