ajax-javascript原生-初步入门01（整理）

-----------------------------------2017.07.21写-----------------------------------------

1.ajax的原名：

　　ajax 即“Asynchronous JavaScript and XML”（异步 JavaScript 和 XML），也就是无刷新数据读取。

2.ajax的基础：http请求

　　个人理解：ajax是在http基础上建立起来的，http有get和post方法

　　get方法（从服务器获取数据）：发送给服务器的数据会附加在url后面，以？分割ulr和发送的数据，如果是多个参数数据，则用&链接。如：

　　               

　　post方法（把数据提交给服务器）：发送给服务器的数据是放在http请求包的包体中，不暴露在地址栏上。

3.ajax的使用（重点）：

　

 <script type="text/javascript">
     var obj={
         method:"GET",//请求方式：GET或者POST
         url:"http://loaclhost/test.txt",//请求地址
         data:"",//发送给服务器的钥匙，可以没有，主要看要求
         success:function(msg){//成功时的回调函数
             console.log(msg);
             msg=eval("("+msg+")");//eval():将字符串转javascript代码，你也可以不转，主要看数据类型及要求
         }
     }
     ajax(obj);//启动ajax

     function ajax(obj){//ajax的封装
         var xhr;
         obj.data=data||null;
         //兼容ie
         if(window.XMLHttpRequest){
             xhr=new XMLHttpRequest();
         }else{
             xhr=new ActiveXObject("Microsoft.XMLHTTP");
         }
         xhr.onreadystatechange=function(){
             if(xhr.status==200 && xhr.readyState==4){//请求成功的状态码
                 obj.success(xhr.response);
             }
         }
         xhr.open(obj.method, obj.url);
         xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
         xhr.send(obj.data);
     }
 </script>

可复制使用。

使用的话封装函数不用动，只需修改obj的method，url，data，以及获取数据成功后你要对数据的修改，另外要注意一点是数据获取到的类型。