XMLHttpRequest 的 readyState的 细节

MLHttpRequest.onreadystatechange 按照定义 是
当 XMLHttpRequest 的 readyState 发生变化时 触发.

[ 注: readyState 在 XMLHttpRequest.open时即改变,
也就是说 onreadystatechange 最好在 open之前设置. ]


在 opera safari chrome IE7 FF3 中是这样.
但是 在 IE6 和 FF2中 却并不总是如此.

==============================

在 opera safari chrome IE7 FF3 中,
只有当 readyState 状态发生变化时 才会触发 onreadystatechange .
这里的"变化" 是指 readyState 有了新值而且这个新值和之前的值不一样.

所以 最后我附上的测试代码 在 opera safari chrome IE7 FF3 中, 每种状态值只会alert一次.

但是 在IE6 和 FF2中 , readyState 只要被重新赋值 ,不管值和之前是否一样,都会触发 onreadystatechange 事件.

xhr.open 之后 readyState==1
xhr.send 之初 readyState==1
....

在上述两个时刻 IE6 和 FF2中 都会触发 onreadystatechange 事件,
而 opera safari chrome IE7 FF3 则只会在 open时触发一次 ,下次触发则已经是在 readyState !== 1 时.

关于此问题 网上也有人提及
http://blog.csdn.net/hulefei29/archive/2008/04/18/2305683.aspx
引用XMLHttpRequest.readyState这个值在IE7和Firefox中都是0，1，2，3，4，
但是经测试，IE各个数都只返回一次，而在firfox中3的值返回多次，
由此可以判断，firfox对readyState值改变的判断的频率高于IE7;...
显然这个"判断的频率"的这个观点是不正确的.
浏览器是不会通过轮询来做检查的, 实现机制应该是在 类似setReadyState()方法里做的.

==============================

另外 在我测试的例子中 , FF2 会alert多次 readyState==3 ,而 IE6 只会alert 一次 readyState==3.
也就是说 在处理 XHR与服务端交互时IE6和FF2的策略 还有所不同.
不过 目前我尚未知晓 具体的不同在哪里.
欢迎有经验的朋友发表一下看法.

==============================

值得注意的是, 在FireFox 3 中XMLHttpRequest.send之后 (readyState==4)
XMLHttpRequest会自动重新初始化 也就是说 在FF3中 下列例子的alert顺序是
1 2 3 4 1
这个特性是目前其他浏览器不具备的.


==============================

还有一个小细节注意一下 :

xmlHttp.onreadystatechange=function(){
// alert(this)
// 注意 上面那句中的 this 不是 xmlHttp, 是window
}


===============================
正是因为 onreadystatechange 有诸多未统一的细节 和不确定性
所以 在ExtJS 中 根本就没有使用 onreadystatechange 来实现对 XMLHttpRequest的监听.
而是 自己通过 setTimeout 和 setInterval 来实现的 XMLHttpRequest状态跟踪.
我想 这也是一个无奈之举吧.


===============================


说了这么多 可能有点太学究了 太专研细节了
对于框架满天飞的今天 这种细节技术可能确实无关紧要.

大家就看个热闹好了 呵呵


==============================



我测试用的代码 很简陋 呵呵 见笑了
Javascript代码

1. // 页面文件就是 testAjax.html , 所以我请求的是自己 .  
2. function createXMLHttp(){  
3.         if (window.XMLHttpRequest) {  
4.             return(new XMLHttpRequest());  
5.          }  
6.         var arr_t = [  
7.             'MSXML2.XMLHTTP.3.0',  
8.             'MSXML2.XMLHTTP',  
9.             'Microsoft.XMLHTTP'  
10.          ]  
11.         for(var i=0; i<arr_t.length; i++) {  
12.             try {  
13.                  xmlhttp_ver = arr_t[i];  
14.                 return new ActiveXObject(arr_t[i]);  
15.              }catch(e) {}  
16.          }  
17.         return null ;  
18. }  
19.   
20. var xmlHttp = createXMLHttp();  
21. xmlHttp.onreadystatechange = function(){  
22.      alert(xmlHttp.readyState);    
23. };  
24. xmlHttp.open('post','testAjax.html',true);  
25. xmlHttp.send()