Ajax请求后台数据(JS原生和jQuery)

什么是Ajax:AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

                    AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。

一、JS原生

   1、创建XMLHttpRequest对象

        var Ajax = new XMLHttpRequest();

    2、向服务器发送请求

          Ajax.open("GET","ajax_info.txt",true);   // 规定请求的类型、URL 以及是否异步处理请求。

          Ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //当请求类型是post时添加,get请求无需添加。

          Ajax.send();   //将请求发送到服务器。

   3、服务器响应以及onreadystatechange事件

          Ajax.onreadystatechange = function(){       //

                 if (Ajax.readyState==4 && Ajax.status==200) {    //每当 readyState 改变时,就会触发 onreadystatechange 事件。readyState 属性存有 XMLHttpRequest 的状态信息。200:OK;

                         console.log(JSON.parse(ajax.responseText));

               }

         }

下面是 XMLHttpRequest 对象的三个重要的属性:

XMLHttpRequest 对象


二、jQuery方法

   1、首先在HTML头部引入jQuery

          从http://jquery.com/download/下载 jQuery 库

          从 CDN 中载入 jQuery, 如:

     <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

   2、调用$Ajax方法

         $.ajax({

               type:'POST', //方式

               url:'upload.php', //请求路径

               asycn:true, //是否异步

               success:function(data){

                      console.log(data);

              }

       })

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容