jQuery中的$.getJSON、$.ajax、$.get、$.post的區別

jQuery中的$.getJSON、$.ajax、$.get、$.post的區別

使用見Flask(python)異步（ajax）返回json格式數據

①.$.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");