Ajax总结

文章目录

前言

一、$.ajax、

二、$.get

三、$.post

四、$.getJSON

总结

---

前言

jquery将它封装成了一个方法$.ajax()，所以在使用该方法时，必须先引用jQuery.js库。

<script src="js/jquery-1.11.4.min.js"></script>

一、$.ajax、

jQuery调用ajax方法：

           格式：$.ajax({})；

           参数：

                     url：请求地址

                     type ：请求方式，默认是'GET'，常用的还有'POST'

                     dataType ：设置返回的数据格式，常用的是'json'格式

                     data ：设置发送给服务器的数据, 没有参数不需要设置

​                     success ：设置请求成功后的回调函数

                     error ：设置请求失败后的回调函数

                     async： 设置是否异步，默认值是'true'，表示异步，一般不用写

示例：

<script>
    $.ajax({
    // 1.url 请求地址
    url:请求的对应地址,
    // 2.type 请求方式，默认是'GET'，常用的还有'POST'
    type:'GET',
    // 3.dataType 设置返回的数据格式，常用的是'json'格式，,如若不是json类型文件则需要调用JSON.parse()方法将返回来的数据转换成对象格式方便操作
    dataType:'JSON',
    // 4.data 设置发送给服务器的数据, 没有参数不需要设置
​
    // 5.success 请求成功后的回调函数
    success:function (res) {
        console.log(res);    
    },
    // 6.error 请求失败后的回调函数
    error:function () {
        alert("请求失败");
    },
    // 7.async 设置是否异步，默认值是'true'表示异步
    async:true
});
</script>

二、$.get

$.ajax按照请求方式可以简写成$.get

示例：

// 1.请求json文件，忽略返回值
$.get('请求地址 ' );

// 2.请求json文件，传递参数，忽略返回值
$.get('请求地址 ' ,{name : "tom" ,age : 18});

// 3.请求json文件,拿到返回值,请求成功后可拿到返回值
$.get('请求地址' ,function(data){
      console.1og(data);
});

// 4.请求json文件,传递参数,拿到返回值
$.get('请求地址 ', {name : " tom" , age:18}, function(data){
      console.log(data) ;
});


//  此处的请求地址的文件是json格式型

三、$.post

$.ajax按照请求方式可以简写成$.post

示例：

//   post跟get差不多，只是请求的方式不同

// 1.请求json文件，忽略返回值
$.post('请求地址 ' );

// 2.请求json文件，传递参数，忽略返回值
$.post('请求地址 ' ,{name : "tom" ,age : 18});

// 3.请求json文件,拿到返回值,请求成功后可拿到返回值
$.post('请求地址' ,function(data){
      console.1og(data);
});

// 4.请求json文件,传递参数,拿到返回值
$.post('请求地址 ', {name : " tom" , age:18}, function(data){
      console.log(data) ;
});


//  此处的请求地址的文件是json格式型

四、$.getJSON

$.ajax按照请求方式可以简写成$.getJSON。这种方式相较于get和post请求方式对于返回文件的类型有固定要求，这种方式返回的数据必须是json类型的数据。

示例：

//  请求json文件,传递参数,拿到返回值
$.getJSON('请求地址 ', {name : " tom" , age:18}, function(data){
      console.log(data) ;
});

---

总结

• ajax 是发送http请求获取后台服务器数据的技术
• ajax的简写方式为$.get和$.post
• 当返回的数据不是json类型文件则需要调用JSON.parse()方法将返回来的数据转换成对象格式方便操作