关于 "XMLHttpRequest 的 readyState" 几个你可能不知道的细节.

请大家原谅这个俗气的标题吧

如果这些你已经知道了 就算我火星好了
反正我早已经加入"火星常驻JE办事处"了.

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

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

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


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

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

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

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

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

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

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

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

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

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

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

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


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

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

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


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


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


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

大家就看个热闹好了 呵呵 :P


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


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

// 页面文件就是 testAjax.html , 所以我请求的是自己 .
function createXMLHttp(){
		if (window.XMLHttpRequest) {
			return(new XMLHttpRequest());
		}
		var arr_t = [
			'MSXML2.XMLHTTP.3.0',
			'MSXML2.XMLHTTP',
			'Microsoft.XMLHTTP'
        ]
		for(var i=0; i<arr_t.length; i++) {
			try {
				xmlhttp_ver = arr_t[i];
				return new ActiveXObject(arr_t[i]);
			}catch(e) {}
		}
		return null ;
}

var xmlHttp = createXMLHttp();
xmlHttp.onreadystatechange = function(){
	alert(xmlHttp.readyState);	
};
xmlHttp.open('post','testAjax.html',true);
xmlHttp.send()