forked from jfriend00/docReady
-
Notifications
You must be signed in to change notification settings - Fork 0
/
docreadytest.html
162 lines (144 loc) · 4.82 KB
/
docreadytest.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>docReady Test Page</title>
<script>
// add event cross browser
function addEvent(elem, event, fn) {
if (elem.addEventListener) {
elem.addEventListener(event, fn, false);
} else {
elem.attachEvent("on" + event, function() {
// set the this pointer same as addEventListener when fn is called
return(fn.call(elem, window.event));
});
}
}
var logs = [];
var eventSet = false;
var loaded = false;
function log(str) {
if (loaded) {
output(str);
} else {
logs.push(str);
}
function output(str) {
var o = document.getElementById("log");
var div = document.createElement("div");
div.appendChild(document.createTextNode(str));
o.appendChild(div);
}
if (!eventSet) {
eventSet = true;
addEvent(window, "load", function() {
loaded = true;
for (var i = 0; i < logs.length; i++) {
output(logs[i]);
}
logs = [];
});
}
}
(function() {
var readyList = [];
var readyFired = false;
var readyEventHandlersInstalled = false;
// call this when the document is ready
// this function protects itself against being called more than once
function ready() {
if (!readyFired) {
log("ready called");
// this must be set to true before we start calling callbacks
readyFired = true;
for (var i = 0; i < readyList.length; i++) {
// if a callback here happens to add new ready handlers,
// the docReady() function will see that it already fired
// and will schedule the callback to run right after
// this event loop finishes so all handlers will still execute
// in order and no new ones will be added to the readyList
// while we are processing the list
readyList[i].fn.call(window, readyList[i].ctx);
}
// allow any closures held by these functions to free
readyList = [];
}
}
function readyStateChange() {
if ( document.readyState === "complete" ) {
log("readyState === 'complete'");
ready();
}
}
function readyLoad() {
log("window load fired");
if (!readyFired) {
log("window load firing ready");
}
ready();
}
// the one public interface
// docReady(fn, context);
// the context argument is optional - if present, it will be passed
// as an argument to the callback
window.docReady = function(callback, context) {
// if ready has already fired, then just schedule the callback
// to fire asynchronously, but right away
if (readyFired) {
setTimeout(function() {
callback(context);
}, 1);
return;
} else {
// add the function and context to the list
readyList.push({fn: callback, ctx: context});
}
// if document already ready to go, schedule the ready function to run
if (document.readyState === "complete") {
setTimeout(ready, 1);
} else if (!readyEventHandlersInstalled) {
// otherwise if we don't have event handlers installed, install them
if (document.addEventListener) {
// first choice is DOMContentLoaded event
document.addEventListener("DOMContentLoaded", ready, false);
// backup is window load event
window.addEventListener("load", readyLoad, false);
} else {
// must be IE
document.attachEvent("onreadystatechange", readyStateChange);
window.attachEvent("onload", readyLoad);
}
readyEventHandlersInstalled = true;
}
}
})();
// test basic functionality
docReady(function() {
document.body.appendChild(document.createTextNode("Hello Text 1"));
// test adding new docReady handler from a docReady callback
docReady(function() {
document.body.appendChild(document.createTextNode(", Hello Text 2"));
});
});
// test finding an ID in the document
docReady(function() {
document.getElementById("test").innerHTML = "Hello ID";
});
// test calling docReady after window load and
// docReady has already fired
addEvent(window, "load", function() {
setTimeout(function() {
document.body.appendChild(document.createTextNode(", Hello Text 2.5"));
docReady(function(arg) {
document.body.appendChild(document.createTextNode(arg));
}, ", Hello Text 3");
}, 1);
});
</script>
</head>
<body>
<div id="log"></div>
<div id="test"></div>
</body>
</html>