js写ajax

AJAX:全称“Asynchronous JavaScript and XML” (异步的JavaScript与XML)

  AJAX请求的特点:

  1,不刷新页面

  2,服务器仅返回需要的数据

  AJAX引擎:XMLHttpRequest

  此对象是浏览器中的内置对象,在目前的所有浏览器中都支持此对象。

  IE中获取此对象:

  if(window.ActiveXObject){ var xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }

  非IE中获取此对象:

  var xmlHttp=new XMLHttpRequest();

  兼容模式:

  var xmlHttp;//声明一个对象 function createXMLHttpRequest(){ if(window.ActiveXObject){//如果是IE,采用这种方式获取 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }else{//非IE采用这种方式获取 xmlHttp=new XMLHttpRequest(); } }

  请求的格式:

   xmlHttp.open(请求方式,请求地址,[是否为异步请求]);

   xmlHttp.send();

  Get请求:

  xmlHttp.open("GET","ajax.do name=tom",true); xmlHttp.send();

  注:

  get请求的传值方式为请求地址后面跟  key=value

  Post请求:

  xmlHttp.open("POST","ajax.do",true); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlHttp.send("name=tom");

  注:

  post请求的传值方式是在send()方法中进行传值,多个值用逗号隔开:name=tom,age=12

  setRequestHeader的意思是设置请求头的类型为表单类型:Content-Type="application/x-www-form- urlencoded" 是form表单的默认属性

  一个完整的AJAX请求的流程:

  1,创建XMLHttpRequest对象

  2,调用xmlHttp.open()设置请求内容

  3,设置回调函数(根据服务器返回的状态信息,做什么事情)

  4,调用xmlHttp.send()发送请求

  function sendAjax(){ createXMLHttpRequest();//调用上面设置的兼容模式 xmlHttp.open("GET","ajax.do name=tom",true); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlHttp.onreadystatechange=callback;//状态信息发生改变调用函数 xmlHttp.send(); } //回调函数 function callback(){ alert("callback"); } sendAjax();//浏览器会弹出几次框(不同的浏览器可能不同)

  获取AJAX请求的状态码和HTTP协议的状态码:

  AJAX请求的状态码有四个值:

  var xmlState=xmlHttp.readyState;

  1,已初始化

  2,数据传输中

  3,响应数据传输中

  4,响应完毕

  HTTP协议的状态码有很多:

  var ;

  常见的状态码如下:
状态码 意义
200 服务器正确处理了请求并响应
404 请求的页面未找到
403 没有权限访问请求的页面
405 页面不接收该请求方式
408 请求超时
500 服务器处理请求时发生异常
503 服务暂时不可用
304 网页未修改

  使用Servlet获取服务器端的文本:

  //ajax.do //这是Servlet类中的doGet方法 public void doGet(HttpServletRequest request,HttpServletResponse response){ PrintWriter out=response.getWriter(); out.print("OK"); out.flush(); out.close(); }

  //callback function callback(){ if(xmlHttp.readyState==4){//响应完毕后 if(xmlHttp.status==200){//http状态码为200时 var result=xmlHttp.responseText;//获取ajax请求的文本内容 alert(result); } } }
总结:

Ajax请求使用 XMLHttpRequest 对象
IE和非IE获取对象的方式不同
GET,POST请求的传值问题
Ajax请求的流程
Ajax请求的状态码和HTTP协议中服务器返回的状态码
获取简单地服务器返回的文本信息
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值