We now have enough information to bring together the complete lifecycle of loading a document, as illustrated in listing 2.11. We instantiate the XMLHttp-Request object, tell it to load a document, and then monitor that load process asynchronously using callback handlers. In the simple example, we define a DOM node called console, to which we can output status information, in order to get a written record of the download process.
sample 2.11:
sample 2.11:
1
<html>
2
<head>
3
<script type='text/javascript'>
4
var req=null;
5
var console=null;
6
var READY_STATE_UNINITIALIZED=0;
7
var READY_STATE_LOADING=1;
8
var READY_STATE_LOADED=2;
9
var READY_STATE_INTERACTIVE=3;
10
var READY_STATE_COMPLETE=4;
11
function sendRequest(url,params,HttpMethod){
12
if (!HttpMethod){
13
HttpMethod="GET";
14
}
15
req=initXMLHTTPRequest();
16
if (req){
17
req.onreadystatechange=onReadyState;
18
req.open(HttpMethod,url,true);
19
req.setRequestHeader
20
("Content-Type", "application/x-www-form-urlencoded");
21
req.send(params);
22
}
23
}
24
function initXMLHTTPRequest(){
25
var xRequest=null;
26
if (window.XMLHttpRequest){
27
xRequest=new XMLHttpRequest();
28
} else if (window.ActiveXObject){
29
xRequest=new ActiveXObject
30
("Microsoft.XMLHTTP");
31
}
32
return xRequest;
33
}
34
function onReadyState(){
35
var ready=req.readyState;
36
var data=null;
37
if (ready==READY_STATE_COMPLETE){
38
data=req.responseText;
39
}else{
40
data="loading
["+ready+"]";
41
}
42
toConsole(data);
43
}
44
function toConsole(data){
45
if (console!=null){
46
var newline=document.createElement("div");
47
console.appendChild(newline);
48
var txt=document.createTextNode(data);
49
newline.appendChild(txt);
50
}
51
}
52
window.onload=function(){
53
console=document.getElementById('console');
54
sendRequest("data.txt");
55
}
56
</script>
57
</head>
58
<body>
59
<div id='console'></div>
60
</body>
61
</html>
![](/Images/OutliningIndicators/None.gif)
2
![](/Images/OutliningIndicators/None.gif)
3
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
4
![](/Images/OutliningIndicators/InBlock.gif)
5
![](/Images/OutliningIndicators/InBlock.gif)
6
![](/Images/OutliningIndicators/InBlock.gif)
7
![](/Images/OutliningIndicators/InBlock.gif)
8
![](/Images/OutliningIndicators/InBlock.gif)
9
![](/Images/OutliningIndicators/InBlock.gif)
10
![](/Images/OutliningIndicators/InBlock.gif)
11
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
12
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
13
![](/Images/OutliningIndicators/InBlock.gif)
14
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
15
![](/Images/OutliningIndicators/InBlock.gif)
16
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
17
![](/Images/OutliningIndicators/InBlock.gif)
18
![](/Images/OutliningIndicators/InBlock.gif)
19
![](/Images/OutliningIndicators/InBlock.gif)
20
![](/Images/OutliningIndicators/InBlock.gif)
21
![](/Images/OutliningIndicators/InBlock.gif)
22
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
23
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
24
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
25
![](/Images/OutliningIndicators/InBlock.gif)
26
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
27
![](/Images/OutliningIndicators/InBlock.gif)
28
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
29
![](/Images/OutliningIndicators/InBlock.gif)
30
![](/Images/OutliningIndicators/InBlock.gif)
31
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
32
![](/Images/OutliningIndicators/InBlock.gif)
33
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
34
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
35
![](/Images/OutliningIndicators/InBlock.gif)
36
![](/Images/OutliningIndicators/InBlock.gif)
37
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
38
![](/Images/OutliningIndicators/InBlock.gif)
39
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
40
![](/Images/OutliningIndicators/InBlock.gif)
![](/Images/dot.gif)
41
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
42
![](/Images/OutliningIndicators/InBlock.gif)
43
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
44
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
45
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
46
![](/Images/OutliningIndicators/InBlock.gif)
47
![](/Images/OutliningIndicators/InBlock.gif)
48
![](/Images/OutliningIndicators/InBlock.gif)
49
![](/Images/OutliningIndicators/InBlock.gif)
50
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
51
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
52
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
53
![](/Images/OutliningIndicators/InBlock.gif)
54
![](/Images/OutliningIndicators/InBlock.gif)
55
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
56
![](/Images/OutliningIndicators/None.gif)
57
![](/Images/OutliningIndicators/None.gif)
58
![](/Images/OutliningIndicators/None.gif)
59
![](/Images/OutliningIndicators/None.gif)
60
![](/Images/OutliningIndicators/None.gif)
61
![](/Images/OutliningIndicators/None.gif)