2014年AJAX思维方式.pptVIP

AJAX技术核心 resultNode.innerHTML = 不能建立XMLHttpRequest对象; resultNode.innerHTML这样的用法是为了设置某个节点中的html的内容，这里resultNode代表的是div那个节点，这句话的效果是使div的内容变成了div id=result不能建立XMLHttpRequest对象/div，这样我们就会在页面中看到这行提示信息。 * AJAX技术核心 if(window.XMLHttpRequest){ xmlhttp = new XMLHttpRequest(); if(xmlhttp.overrideMimetype){ xmlHttp.overrideMimeType(text/xml); } } else if (window.ActiveXObject) { var MSXML = [MSXML2.XMLHTTP.6.0,MSXML2.XMLHTTP.5.0, MSXML2.XMLHTTP.4.0,MSXML2.XMLHTTP.3.0, MSXML2.XMLHTTP,Microsoft.XMLHTTP]; for(var n = 0; n MSXML.length; n ++){ try{ xmlhttp = new ActiveXObject(MSXML[n]); break; }catch(e){} } } If(xmlhttp == null){ resultNode.innerHTML = 不能建立XMLHttpRequest对象; return false; } * AJAX技术核心 “window.XMLHttpRequest”为true时表示当前浏览器是IE7或其他浏览器，我们就可以使用new XMLHttpRequest()的方式来创建一个XMLHttpRequest对象 if(xmlhttp.overrideMimetype)这个逻辑的作用是解决部分版本的Mozilla在服务器响应头信息没有XML时不能正常工作的问题。 * AJAX技术核心 “window.ActiveXObject”为true时表示当前的浏览器为IE6.0及以下的版本，要使用new ActiveXObject(控件名)的方式来创建一个XMLHttpRequest对象 这里需要注意的是不同版本IE中用于建立XMLHttpRequest对象的控件版本很多 如果使用MSXML数组中的某一个控件名称成功建立了XMLHttpRequest对象，则跳出循环，如果建立失败会有异常抛出，被catch以后继续进行循环，尝试下一个控件名称 这里的控件名称是按照从新到老的顺序排列的，这样可以保证使用较新版本IE的用户可以较早成功建立XMLHttpRequest对象。 如果没有建立成功XMLHttpRequest对象，则不能继续后面与服务器端交互的工作，函数只能返回。 * AJAX技术核心 xmlhttp.onreadystatechange=callback; 然后我们做的工作是设置一个回调函数 回想前面我们说过的AJAX的模式的特点，由于我们采用异步交互的模型，不像同步模式一样可以直接接收响应内容，因此我们需要告诉AJAX引擎当响应数据回来时我要做一些工作，这些工作就是回调函数中的内容。 这里需要注意的是设置回调函数时应该只给出回调函数的名称，后面不要带括号，因为带上括号就变成让XMLHttpRequest对象的onreadystatechange属性值等于回调函数的返回值了。 * AJAX技术核心 xmlhttp.open(GET,AJAXServer?name= + encodeURI(encodeURI(name)),true); 接下来要做的工作是建立对服务器的调用。这里第一个参数表示http连接的方法, 一般我们使用“GET”或“POST”方式，两种方式的区别会在后面阐述。 第二个参数是服务器端地址，由于使用GET方式，因此要传送给服务器端的数据也在URL中，这里我们使用了两个encodeURI，目的是为了解决URL中的中文信息在服务器端解码的问题，配合服务器端的URLDecoder.decode(old,“UTF-8”)语句可以保证中文信息在服务器端也可以正常被解出。 第三个参数表示是否采用异步方式进行传输，其中true表示采用异步方式，我们在AJAX中看重的就是异步方式，因此这个参数我们通常使用true。 * AJAX技术核心 xmlhttp.send(null); 再接着就是向服务器端发送数据，这里由于已经在URL中包含了发送给服务器的数据，因此在send时就不需要参数了，后面