//第一个:创建ajax引擎对象 这是ajax开发的核心对象 XmlHttpRequest function createXmlHttpRequest(){ var xmlHttp; try { //Firefox,Opera 8.0+,Safari xmlHttp = new XMLHttpRequest(); } catch (e) { try { //Internet Explorer xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } } } return xmlHttp; } window.onload=function(){ document.getElementById("ok").onclick = function(){ //1.创建一个ajax引擎 var xmlHttp=createXmlHttpRequest(); //4.处理服务器响应数据 xmlHttp.onreadystatechange=function(){ alert(xmlHttp.readyState) if(xmlHttp.readyState==4){ if(xmlHttp.status==200 || xmlHttp.status==304){ //接受服务器响应结果; var data=xmlHttp.responseText; alert(data); } } } //2.打开一个连接 /** * open(method,url,asynch) * method:请求类型:get和post;字符串 * URL:请求路径可以是相对路径和绝对路径 * asynch:表示是否是异步传输:默认是true异步的 */ xmlHttp.open("get","../ajaxServlet?name=liuzhaoqiang×tamp="+new Date().getTime(),true); //如果是post请求的需要从小设置编码格式 这样可以通知服务器当的请求格式 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //3.项服务器发送数据 /** * send(data) data:客户端项服务器发送的数据 * 若选用的是get请求:这不会发送任何数据 给send方法传递null 如果传值服务器也接收不到 * */ xmlHttp.send(null); /** * onreadystatechange=function(){}; * 事件处理函数(监听器) 可以监听服务器端每一步的操作 操作通知给浏览器 有服务器触发 * 这依靠更新 XMLHttpRequest 对象的 readyState 来实现。改变 readyState 属性是服务器对客户端连接操作的一种方式 * 0 代表未初始化。 还没有调用 open 方法 1 代表正在加载。 open 方法已被调用,但 send 方法还没有被调用 2 代表已加载完毕。send 已被调用。请求已经开始 3 代表交互中。服务器正在发送响应 4 代表完成。响应发送完毕 每次 readyState 值的改变,都会触发 readystatechange 事件 在xmlHttpRequest对象中同时存放status对象 存放访问服务器的状态码 404 没找到页面(not found) 403 禁止访问(forbidden) 500 内部服务器出错(internal service error) 200 一切正常(ok) 304 没有被修改(not modified)(服务器返回304状态,表示源文件没有被修改 ) */ } }