摘要：封裝和跨域知識使用還是是通過參數傳遞到當前腳本的變量數組。對所發送信息的數量也有限制。請求成功時觸發，。允許一個域上的網絡應用向另一個域提交跨域請求。

$_GET 是通過 URL 參數傳遞到當前腳本的變量數組。

$_POST 是通過 HTTP POST 傳遞到當前腳本的變量數組。

通過 GET 方法從表單發送的信息_對任何人都是可見的_（所有變量名和值都顯示在 URL 中）。GET 對所發送信息的數量也有限制。限制在大于 2000 個字符。不過，由于變量顯示在 URL 中，把頁面添加到書簽中也更為方便。
GET 可用于發送非敏感的數據。
注釋：絕不能使用 GET 來發送密碼或其他敏感信息！

通過 POST 方法從表單發送的信息_對其他人是不可見的_（所有名稱/值會被嵌入 HTTP 請求的主體中），并且對所發送信息的數量也_無限制_。

此外 POST 支持高階功能，比如在向服務器上傳文件時進行 multi-part 二進制輸入。

不過，由于變量未顯示在 URL 中，也就無法將頁面添加到書簽。
提示：開發者偏愛 POST 來發送表單數據。
接下來讓我們看看如何安全地處理 PHP 表單！

Name: 
* 

與 POST 相比，GET 更簡單也更快，并且在大部分情況下都能用。

然而，在以下情況中，請使用 POST 請求：

無法使用緩存文件（更新服務器上的文件或數據庫）

向服務器發送大量數據（POST 沒有數據量限制）

發送包含未知字符的用戶輸入時，POST 比 GET 更穩定也更可靠

引用自：SF

學習Ajax，并嘗試自己封裝一個Ajax方法。實現如下方法：

function ajax(url, options) {
    // your implement
}
// 使用示例：
ajax(
    "http://localhost:8080/server/ajaxtest", 
    {
        data: {
            name: "simon",
            password: "123456"
        },
        onsuccess: function (responseText, xhr) {
            console.log(responseText);
        }
    }
);

options是一個對象，里面可以包括的參數為：
type: post或者get，可以有一個默認值
data: 發送的數據，為一個鍵值對象或者為一個用&連接的賦值字符串。使用=來連接鍵與值，使用&來連接多個請求參數
onsuccess: 成功時的調用函數
onfail: 失敗時的調用函數

/**
 * AJAX函數封裝
 * @param {string} url     請求地址（必須）
 * @param {object} options 發送請求的選項參數
 *   @config {string} [options.type] 請求發送的類型。默認為GET。
 *   @config {Object} [options.data] 需要發送的數據。
 *   @config {Function} [options.onsuccess] 請求成功時觸發，function(oAjax.responseText, oAjax)。（必須）
 *   @config {Function} [options.onfail] 請求失敗時觸發，function(oAjax)。(oAJax為XMLHttpRequest對象)
 *
 *@returns {XMLHttpRequest} 發送請求的XMLHttpRequest對象
 */
function ajax(url, options) {
    //1.創建ajax對象
    var oAjax = null;
        /**
         * 此處必須需要使用window.的方式,表示為window對象的一個屬性.不存在時值為undefined,進入else
         * 若直接使用XMLHttpRequest,在不支持的情況下會報錯
         **/
    if (window.XMLHttpRequest) {
        //IE6以上
        oAjax = new XMLHttpRequest();
    } else {
        oAjax = new ActiveXObject("Microsoft.XMLHTTP");
    }
    
    //2.連接服務器
    //open(方法,url,是否異步)
    var param = ""; //請求參數。
    //只有data存在，且為對象使才執行
    var data = options.data ? options.data : -1; //緩存data
    if (typeof (data) === "object") {
        for (var key in data) { //請求參數拼接
            if (data.hasOwnProperty(key)) {
                param += key + "=" + data[key] + "&";
            }
        }
        param.replace(/&$/, "");
    } else {
        param = "timestamp=" + new Date().getTime();
    }

    //3.發送請求
    var type = options.type ? options.type.toUpperCase() : "GET";
    if (type === "GET") {
        oAjax.open("GET", url + "?" + param, true);
        oAjax.send();
    } else {
        oAjax.open("POST", url, true);
        oAjax.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        oAjax.send(param);
    }

    //4.接收返回
    //OnRedayStateChange事件
    oAjax.onreadystatechange = function () {
        if (oAjax.readyState === 4) {
            if (oAjax.status === 200) {
                //請求成功。形參為獲取到的字符串形式的響應數據
                options.onsuccess(oAjax.responseText, oAjax);
            } else {
                //先判斷是否存在請求失敗函數
                //存在時，形參為XMLHttpRequest對象，便于進行錯誤進行處理
                if (options.onfail) {
                    options.onfail(oAjax);
                }
            }
        }
    };
    return oAjax;//發送請求的XMLHttpRequest對象
}

ajax本身并不能跨域，要借助其他方式進行跨域。引用有SF

可能平時最常用到的就是get方式的jsonp跨域，可以用jquery提供的$.ajax 、$.getJSON。

$.ajax({
    url:"接口地址",
    type:"GET",
    data:"想給接口傳的數據",
    dataType:"jsonp",
    success:function(ret){
        console.log(ret);
    }
});

這樣很簡單的就可以實現jsonp的跨域，獲取接口返回值。實現原理是利用script標簽跨域

a.com html:

a.com callback.php:
";
//回調原頁面上函數處理返回結果
echo "window.top.postcallback(" .$_GET["data"]. ");";
echo "";

b.com api.php:


CORS跨域
原理：CORS定義一種跨域訪問的機制，可以讓AJAX實現跨域訪問。CORS 允許一個域上的網絡應用向另一個域提交跨域 AJAX 請求。實現此功能非常簡單，只需由服務器發送一個響應標頭即可。
注：移動終端上，除了opera Mini都支持。
利用 CORS，http://www.b.com 只需添加一個標頭，就可以允許來自 http://www.a.com 的請求，下圖是我在PHP中的 hander() 設置，“*”號表示允許任何域向我們的服務端提交請求：
header("Access-Control-Allow-Origin:*");
也可以設置指定域名：
header("Access-Control-Allow-Origin:http://www.b.com");
js部分：
$.ajax({
    url: a_cross_domain_url,
    crossDomain: true,
    method: "POST"
});
CORS比較適合應用在傳送信息量較大以及移動端來使用。
script標簽來跨域（有待補充調整）

js.onload = js.onreadystatechange = function() {
    if (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") {
        // callback在此處執行
        js.onload = js.onreadystatechange = null;
    }
};
h5的postMessage
otherWindow.postMessage(message, targetOrigin);
otherWindow: 對接收信息頁面的window的引用。可以是頁面中iframe的contentWindow屬性；window.open的返回值；通過name或下標從window.frames取到的值。
message: 所要發送的數據，string類型。
targetOrigin: 用于限制otherWindow，“*”表示不作限制
a.com/index.html中的代碼：


b.com/index.html中的代碼：

6、子域跨域（document.domain+iframe）(h5中這個標簽已經被禁止了)
www.a.com上的a.html
document.domain = "a.com";
var ifr = document.createElement("iframe");
ifr.src = "http://script.a.com/b.html";
ifr.style.display = "none";
document.body.appendChild(ifr);
ifr.onload = function(){
    var doc = ifr.contentDocument || ifr.contentWindow.document;
    // 在這里操縱b.html
    alert(doc.getElementsByTagName("h1")[0].childNodes[0].nodeValue);
};
script.a.com上的b.html
document.domain = "a.com";
具體的做法是可以在 http://www.a.com/a.html 和http://script.a.com/b.html兩... = "a.com"；然后通過a.html文件中創建一個iframe，去控制iframe的contentDocument，這樣兩個js文件之間就可以“交互”了。當然這種辦法只能解決主域相同而二級域名不同的情況。