ajax在IE中无法正常测试原因的探索及学习
愚蠢的测试
《JavaScript DOM编程艺术》P116，
问了一下别人，IE需要配置服务器 localhost:8080才能对这个网页有响应。。。需要配置tomcat和Java JDK。配了一晚上！终于搞定了。这里我讨论4种情况。（可以把无服务器的IE当成错误的结果）
1.无服务器测试AJAX时，IE11中无法得出结果，只有空白的页面。（错误原因：
request.open( "GET","example.txt",true );拒绝访问）
服务器中，IE中"Response Received"先于"function Done"，响应快。页面正常。
无论是否在服务器中，火狐中的"function Done"都先于"Response Received"。说明响应慢。页面正常。
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
return new XMLHttpRequest();
}
2.改成如下，无服务器，IE只弹出”1”，仍然是空白页面。（错误原因：
request.open( "GET","example.txt",true );拒绝访问）
服务器中，IE中弹出顺序为”1”,"Response Received"，"function Done"。响应快。页面正常。
无论是否在服务器中，火狐的弹出顺序都为”1”,"function Done"，"Response Received"。响应慢。页面正常。
function getHTTPObject(){
alert("1"); //说明一定会运行到这里
if(typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
return new XMLHttpRequest();
}
或者
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
alert("1"); //也能说明一定能运行这里。
return new XMLHttpRequest();
} //（无错误）
3.改成如下，放在if之后，IE中"Response Received"先于"function Done"，说明响应快了。没有弹2,页面正常。
火狐空白页面。
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
alert("2"); //为什么前面无服务器IE无法正常显示这里却可以了？？简直就像开了服务器
//一样。
//只要IE的这里没有alert();就没有反应，有就有反应。
//只要火狐这里没有alert();就有反应，和IE相反。这里是关键点。
//认真考虑了一下这句话，好像把if语句终结了，所以下面是个全新的函数，
不会调用是理所当然。另一方面，不会弹出“2”说明了typeof XMLHttpRequest 不等于"undefined"在两个浏览器都是成立的，说明了两个浏览器都支持XMLHttpRequest()函数！
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
return new XMLHttpRequest();
}
4.改成如下，两个浏览器都是空白的，没反应。
只要放在catch(e){}之前：
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
alert("4"); //错误原因是缺少 'catch'，不能分开的。
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
return new XMLHttpRequest();
}
或者
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}alert("5"); //如果alert写在下一行，那么就是第2点的结果，为什么？？？
//因为分行符就是等于自动添加分号;。所以正确写法应该是};alert("5");
return new XMLHttpRequest();
}
5.改成如下，或者放在其他上述没提到的地方。回到了第1点的结果。说明了什么？
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
XMLHttpRequest = function(){
alert("5"); //说明这里有没有没差别，可能根本没运行这里。结合上面，这个函数typeof XMLHttpRequest == "undefined"是一直不等的，所以这里肯定不运行，直接return newXMLHttpRequest();说明了一个问题IE中typeof XMLHttpRequest 不等于"undefined"，但是系统的 XMLHttpRequest();也无法直接运行，需要服务器环境。
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
return new XMLHttpRequest();
}
7.从测试结果来看，火狐默认拥有自身的服务器，不需要另外搭建
8.IE中"Response Received"一直先于"function Done"，响应比函数快。火狐则相反。
（测试中发现响应速度与F12文档模式有关，说明IE默认的edge响应比一般的8快）
所以可以忽略上面的先后顺序。
9.改成如下，IE中弹出”1”,"Response Received"，"function Done"，页面正常
火狐只弹1，空白页面。
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
alert("2");
XMLHttpRequest = function(){
alert("1"); //说明了当上面有alert函数时这里一定会被运行到。
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
return new XMLHttpRequest();
}
10.如下，IE只弹出"Response Received"，"function Done"，页面正常。
但是火狐只弹1，空白页面
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined")
alert("2");
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
alert("1"); //说明火狐会运行到这里，IE不会。
return false;
}
return new XMLHttpRequest();
}
11.总结性的测试。IE中弹出1,5,3，"Response Received"，"function Done"，页面正常。
火狐中弹出1,5,3,4，空白页面。
function getHTTPObject(){
alert("1");
if(typeof XMLHttpRequest == "undefined")
alert("2");
XMLHttpRequest = function(){
alert("3");
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
alert("4"); //结合上面，一切都明了了，if语句被终结，两个浏览器都支持XMLHttpRequest()，所以进行最后一步return new XMLHttpRequest();，调用自定义的函数（注意这里的是自定义的XMLHttpRequest()函数，不是系统的，所以IE也能运行了），弹出“3”,然后IE中也支持Msxml2.XMLHTTP.6.0或者其中的一个，所以IE不会进行到弹出“4”这一步，就可以正常地显示页面了。火狐不支持Msxml2.XMLHTTP.6.0或者ActiveXObject()，所以会进行到底，而且没有正确地显示页面。
return false;
}
alert("5");
return new XMLHttpRequest();
}
