JS原生ajax函数写法

 

html结构:

<h3>这是一段不变的内容这是一段不变的内容这是一段不变的内容</h3>

<div class="content-box">

 <textarea id="text">

　　　　如果要让用户留在当前页面中，同时发出新的HTTP请求，就必须用JavaScript发送这个新请求，接收到数据后，再用JavaScript更新页面，这样一来，用户就感觉自己　仍然停留在当前页面，但是数据却可以不断地更新。

　　</textarea>

</div>

<button id="btnchange">换一换</button>

JS ajax写法:

window.onload=function(){

 function clickbtn(){

  var request;

  if(window.XMLHttpRequest){

   request=new XMLHttpRequest(); // 新建XMLHttpRequest对象

  }else{

   request=new ActiveXObject('Microsoft.XMLHTTP'); //兼容ie

  }

  request.open('GET','/ajax/index',true);

  request.onreadystatechange=function(){ // 状态发生变化时，函数被回调

   if(request.readyState===4){ // 成功完成

    if(request.status===200){

     var text=request.responseText;//成功，通过responseText拿到响应的文本

     document.getElementById('text').value=text;

    }else{

     var err=fail(response.status);// 失败，根据响应码判断失败原因

     alert(err);

    }

   }else{

    // HTTP请求还在继续...

   }

  }

  // 最后调用send()方法才真正发送请求

  request.send();//POST请求需要把body部分以字符串或者FormData对象传进去

 }

 document.getElementById('btnchange').onclick=clickbtn;

}