首页 > 代码库 > ajax在IE中无法正常测试原因的探索及学习

ajax在IE中无法正常测试原因的探索及学习

愚蠢的测试

《JavaScript DOM编程艺术》P116

问了一下别人,IE需要配置服务器 localhost:8080才能对这个网页有响应。。。需要配置tomcatJava 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();说明了一个问题IEtypeof 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();

}

ajax在IE中无法正常测试原因的探索及学习