( json才是目的，jsonp只是手段）
JSON是一種數據交換格式，而JSONP是JSON的一種使用模式，是基于JSON的簡單說就是JSON是協議，而JSONP是使用這種協議的一種方法。
json和jsonp雖然只有一個字母的區別，但是它們之間扯不上關系。
json是一種輕量級的數據交換格式。json返回的是一串數據.
jsonp是一種跨域數據交互協議。sonp返回的是腳本代碼（包含一個函數調用）。
json的優點：（1）基于純文本傳遞極其簡單，（2）輕量級數據格式適合互聯網傳遞，（3）容易編寫和解析。
ajax和jsonp的區別：
相同點：都是請求一個url
不同點：ajax的核心是通過xmlHttpRequest獲取內容jsonp的核心則是動態添加<script>標簽來調用服務器 提供的js腳本。
為什么要用jsonp?
json是理想的數據交換格式，但沒辦法跨域直接獲取，于是就將json包裹(padding)在一個合法的js語句中作為js文件傳過去。這就是json和jsonp的區別，json是想要的東西，jsonp是達到這個目的而普遍采用的一種方法，當然最終獲得和處理的還是json。所以說json是目的，jsonp只是手段。json總會用到，而jsonp只有在跨域獲取數據才會用到。
原生js的jsonp
假如我寫了個html頁面，頁面里有個請求，請求的是一個json數據(同源狀態下，沒有跨域)
html代碼：
image.png
json代碼：
image.png
控制臺輸出：
image.png
將上面的鏈接地址的域名換一下，就報錯了，很顯然，提示跨域了！怎么搞？這時jsonp就要出馬了！
url: 'http://10.80.1.211/PHP/json_jsonp/a.json',
image.png
jsonp的實現核心就是利用script標簽的跨域能力！于是我們靈機一動，似乎可以這么搞，動態生成一個script標簽，把json的url賦值給script的src屬性，然后再把這個script標簽插入dom里...
image.png
我們創建了一個script標簽，而標簽內包裹的內容正是需要的json數據，但是報錯如下：
image.png
原因是因為json數據并不是合法的js語句，把上面的json數據放在一個回調函數中是最簡單的方法：
html代碼
image.png
php代碼
image.png
運行結果
image.png
JQuery對jsonp的封裝
為了便于開發，jq對jsonp也進行了封裝，封裝在了ajax方法中。
html代碼
image.png
php代碼
image.png
運行結果
image.png
總結
由于同源策略的限制，XmlHttpRequest只允許請求當前源（域名、協議、端口）的資源，為了實現跨域請求，可以通過script標簽實現跨域請求，然后在服務端輸出JSON數據并執行回調函數，從而解決了跨域的數據請求，這就是jsonp的核心。
jsonp原理：
1.首先在客戶端注冊一個callback, 然后把callback的名字傳給服務器。
2.服務器先生成 json 數據。 然后以 javascript 語法的方式，生成一個function , function 名字就是傳遞上來的參數 jsonp. 最后將 json 數據直接以入參的方式，放置到 function 中，這樣就生成了一段 js 語法的文檔，返回給客戶端。
3.客戶端瀏覽器，解析script標簽，并執行返回的 javascript 文檔，此時數據作為參數，傳入到了客戶端預先定義好的 callback 函數里.（動態執行回調函數）
我的博客鏈接
更多資源就在我的gitHub：https://github.com/huzixian2017/huzixian2017.github.io
