jQuery中的$.getJSON、$.ajax、$.get、$.post的区别

2020-09-12 16:02:56 阅读：266 来源： 互联网

标签：jQuery obj get url getJSON ajax post data

jQuery中的$.getJSON、$.ajax、$.get、$.post的区别

①.$.getJSON

　　$.getJSON()是专门为ajax获取json数据而设置的，并且支持跨域调用，其语法的格式为：

getJSON(url,[data],[callback])

url：string类型，发送请求地址
data ：可选参数，待发送 Key/value 参数，同get，post类型的data
callback ：可选参数，载入成功时回调函数，同get，post类型的callback

$.getJSON("{{ url_for('form_data') }}",params, function (result) {
                $("#myDiv").append("hello world1");
                console.log(obj.username + "<br>");
         });

②.$.ajax

$.ajax 是 jQuery 底层 AJAX 实现，$.ajax是一种通用的底层封装，$.ajax()请求数据之后，则需要使用回调函数，有beforeSend、error、dataFilter、success、complete等。

格式：

$.ajax({ 
   url:”路径”, 
   type:”post/get”, 
  datatype:”json”, 
  //成功的回调函数 
   success:function(data){ 
   alert(“回调函数成功了”); 
}, 
   //失败的回调函数 
   error:function(){ 
   alert(“服务器请求失败”); 
   },

    //发送请求前调用，可以放一些“正在加载”之类的话 
    beforeSend:function(){ 
    alert(“正在加载”); 
    } 
});

例如：

        $.ajax({
            "url": "{{ url_for('form_data') }}",
            "type": "POST",
            "data": params,
            "success": function (obj) {
                $("#myDiv").append("hello world")
                console.log(obj.username + "<br>")
            },
            "error": function (obj) {
                console.log(obj)
            },
            "dataType": "json",
            "async": true
         });

③.$.get

$.get是简单易用的高层实现，我们使用$.get方法，jQuery会自动封装调用底层的$.ajax。

$.get 只处理简单的 GET 请求功能以取代复杂 $.ajax，请求成功时可调用回调函数。不支持出错时执行函数，否则必须使用$.ajax。

$.get( url ,[data] ,[callback] )

url：string类型，ajax请求的地址。
data：可选参数，object类型，发送至服务器的key/value数据会作为QueryString附加到请求URL中。
callback：可选参数，function类型，当ajax返回成功时自动调用该函数。

例如：

 $.get("{{ url_for('form_data') }}", params, function (obj) {
            $("#myDiv").append("hello world")
            console.log(obj.username + "<br>");
         }, "json");

④.$.post

$.post是简单易用的高层实现，我们使用$.post方法，jQuery会自动封装调用底层的$.ajax。

$.post 只处理 post请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。不支持出错时执行函数，否则必须使用$.ajax。

$.post(url,[data],[callback],[type])

这个方法和$.get()用法差不多，唯独多了一个type参数，那么这里就只介绍type参数吧，其他的参考上面$.get()的。

type：type为请求的数据类型，可以是html,xml,json等类型，如果我们设置这个参数为：json，那么返回的格式则是json格式的，如果没有设置，就和.get()返回的格式一样，都是字符串的。

例如：

$.post("{{ url_for('form_data') }}", params, function (obj) {
            $("#myDiv").append(obj.username + "<br>")
            console.log(obj);
        }, "json");

出处：http://www.cnblogs.com/hoaprox

标签：jQuery,obj,get,url,getJSON,ajax,post,data
来源： https://www.cnblogs.com/spring1997/p/13657341.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

jQuery中的$.getJSON、$.ajax、$.get、$.post的区别

jQuery中的$.getJSON、$.ajax、$.get、$.post的区别