前言：ajax和jsonp可以與后臺通信，獲取數據和信息，但是又不用刷新整個頁面，實現頁面的局部刷新。
一、ajax
•定義：一種發送http請求與后臺進行異步通訊的技術。
•原理：實例化xmlhttp對象，使用此對象與后臺通信。
ajax的同源策略：
•ajax請求的頁面或資源只能是同一個域下面的資源，不能是其他域的資源，這是在設計ajax時基于安全考慮。
--------------------------------------------------------------------------------
ajax的方法：
1. $.ajax({}):
•常用參數： •url：請求網絡地址
•type：請求方式，默認是'GET'，常用'POST'
•dataType：設置返回的數據格式，一般使用json，也可以是html和jsonp；
•data：設置發送給服務器的數據
•.done():設置請求成功后的回調函數
•.fail():設置請求失敗后的回調函數
•async:設置是否異步，默認值是'true'，表示異步
•代碼運用：
$(function () { $("input").click(function () { $.ajax({ url: "./data.json", type: "get", dataType: "json", }); .done(function(data) {//請求成功的回調函數 $("input").val(dat.name); }) .fail(function() { alert('服務器超時，請重試！'); }); });})......<body> <div> <input type="button" value="xinzhi"> </div></body>說明：data表示后臺返回的數據；ajax使用需要依賴服務器環境。
2. $.get():
•$.get() 方法使用GET請求從服務器加載數據;也是一種無刷新的請求數據的ajax方法。
•參數：
•url:訪問的網址，需要遵循同源策略；
•data:發送到服務器的數據。
•function(data,status){}：請求成功運行的函數
•dataType：請求響應的數據類型。
//參考代碼：$(function () { $("input").click(function () { $.get( "./data.json", function (data,status) { console.log(data.name); }, "json" ); });})......<body> <div> <input type="button" value="xinzhi"> </div></body>•$.get()方法的參數和$.ajax()不一樣，網址url為必須的參數，其他三個可選。
•data為返回的數據，status表示請求的狀態，一般有""success","error","timeout"等幾種。
•如果datatype類型為jsonp，也可以跨域請求數據。
•無請求失敗的回調函數。
3. $.post()
•$.get() 方法使用POST請求從服務器加載數據;
•其使用的方法和$.get()方法完全一樣。
4. $.load():
•從服務器加載數據，不需要指定datatype,返回的數據會自動放置到元素中。
新聞熱點
疑難解答
圖片精選
