AJAX (Asynchronous JavaScript and XML) 是一種用于創建交互式網頁應用程序的技術，其主要作用是通過異步方式向服務器發送請求并在不刷新整個頁面的情況下獲取數據。
其中，getjsonp 是常用的 AJAX 請求方式之一，它主要用于解決由于瀏覽器的同源策略導致的跨域限制問題。本文將重點介紹 getjsonp 的用法和案例。
什么是 getjsonp?
JSONP (JSON with Padding) 是一種通過在頁面上動態創建 script 元素的方式來跨域獲取數據的方法。通過設置該 script 的 src 屬性，我們可以讓瀏覽器從其他域中獲取數據并將其作為 JavaScript 代碼執行。
相比于使用傳統的 XMLHttpRequest 對象發送 AJAX 請求，getjsonp 的優點在于它不受同源策略的限制。這意味著我們可以在頁面上調用不同域的 API，并獲取其返回的數據。
getjsonp 的用法
使用 getjsonp 的步驟如下：
- 創建一個用來指定回調函數的函數。這個函數會在服務端返回數據時自動調用，并將數據作為參數傳入。
- 創建一個 script 元素，并設置其 src 屬性為需要請求數據的 API 地址，同時在該地址中傳遞回調函數的參數。
- 將 script 元素添加到頁面中。
下面是一個示例，演示如何使用 getjsonp 獲取不同域的數據：
// 步驟 1: 創建回調函數
function handleData(data) {
console.log(data); // 在控制臺打印獲取到的數據
}
// 步驟 2: 創建 script 元素
var script = document.createElement('script');
script.src = 'https://api.example.com/data?callback=handleData';
// 步驟 3: 將 script 元素添加到頁面中
document.body.appendChild(script);在上面的示例中，我們創建了一個名為 handleData 的回調函數，并將其作為參數傳遞給了被請求的 API 地址中的 callback 參數。當 API 返回數據時，瀏覽器會將獲取到的數據作為 JavaScript 代碼執行，并調用 handleData 函數并將數據作為參數傳入。
這是一個簡單的使用 getjsonp 的案例，但其實現了從不同域獲取數據的功能。
getjsonp 的注意事項
使用 getjsonp 需要注意以下幾點：
- 由于 getjsonp 是通過動態創建 script 元素來實現的，因此返回的數據必須是有效的 JavaScript 代碼。
- 為了確保回調函數的全局可用性，需要將其定義在全局作用域中。
- 在使用 getjsonp 跨域請求數據時，服務器端需要支持返回 JSONP 格式的數據，即返回的數據需要被包裹在回調函數中。
- 由于 getjsonp 請求是通過 script 元素的 src 屬性發起的，因此不支持發送 POST 請求。
總結
getjsonp 是一種用于跨域獲取數據的 AJAX 請求方式，通過動態創建 script 元素并指定回調函數，我們可以在頁面上調用不同域的 API 并獲取其返回的數據。但需要注意的是，返回的數據必須是有效的 JavaScript 代碼，回調函數需要定義在全局作用域中，并且服務器端需要支持返回 JSONP 格式的數據。
通過 getjsonp ，我們可以更靈活地獲取數據，為網頁應用程序帶來更好的用戶體驗。