AJAX 可以使網(wǎng)頁實(shí)現(xiàn)異步更新，XMLHttpRequest 是 AJAX 的基礎(chǔ)，大部分瀏覽器均支持 XMLHttpRequest 對象（IE5 和 IE6 使用 ActiveXObject）,XMLHttpRequest對象基于HTTP協(xié)議用于在后臺與服務(wù)器交換數(shù)據(jù)。
HTTP/1.1 協(xié)議規(guī)定的 HTTP 請求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 這幾種。其中 POST 一般用來向服務(wù)端提交數(shù)據(jù)，這里主要說 POST 提交數(shù)據(jù)的方式。HTTP 協(xié)議是以 ASCII 碼傳輸，建立在 TCP/IP 協(xié)議之上的應(yīng)用層規(guī)范。規(guī)范把 HTTP 請求分為三個部分：狀態(tài)行、請求頭、消息主體。
數(shù)據(jù)發(fā)送出去，需要服務(wù)端解析，一般服務(wù)端語言如 php、python 等，以及它們的 framework，都內(nèi)置了自動解析常見數(shù)據(jù)格式的功能。服務(wù)端通常是根據(jù)請求頭（headers）中的 Content-Type 字段來獲知請求中的消息主體是用何種方式編碼，再對主體進(jìn)行解析。所以說到 POST 提交數(shù)據(jù)方案，包含了 Content-Type 和消息主體編碼方式兩部分。Cntent-Type有以下常見4種類型：
（1） application/x-www-form-urlencoded
這應(yīng)該是最常見的 POST 提交數(shù)據(jù)的方式了。瀏覽器的原生 form 表單，如果不設(shè)置 enctype 屬性，那么最終就會以 application/x-www-form-urlencoded 方式提交數(shù)據(jù)。
（2）multipart/form-data
這又是一個常見的 POST 數(shù)據(jù)提交的方式。我們使用表單上傳文件時，必須讓 form 的 enctyped 等于這個值。
（3）application/json
現(xiàn)在越來越多的人把它作為請求頭，用來告訴服務(wù)端消息主體是序列化后的 JSON 字符串。因?yàn)镴SON的規(guī)范，數(shù)據(jù)不容易出錯。
（4）text/xml
它是一種使用 HTTP 作為傳輸協(xié)議，XML 作為編碼方式的遠(yuǎn)程調(diào)用規(guī)范。

創(chuàng)新互聯(lián)是一家以網(wǎng)絡(luò)技術(shù)公司，為中小企業(yè)提供網(wǎng)站維護(hù)、成都網(wǎng)站制作、成都網(wǎng)站建設(shè)、外貿(mào)營銷網(wǎng)站建設(shè)、網(wǎng)站備案、服務(wù)器租用、主機(jī)域名、軟件開發(fā)、微信小程序等企業(yè)互聯(lián)網(wǎng)相關(guān)業(yè)務(wù)，是一家有著豐富的互聯(lián)網(wǎng)運(yùn)營推廣經(jīng)驗(yàn)的科技公司，有著多年的網(wǎng)站建站經(jīng)驗(yàn)，致力于幫助中小企業(yè)在互聯(lián)網(wǎng)讓打出自已的品牌和口碑，讓企業(yè)在互聯(lián)網(wǎng)上打開一個面向全國乃至全球的業(yè)務(wù)窗口：建站歡迎咨詢：18982081108

這里需要注意的是在調(diào)用某個接口是，一定要注意接口請求的方式，如果是post，對應(yīng)的enctype是什么（即請求時選擇Content-Type為哪種類型）
這里以某個笑話接口為例，這里客服端為jquery的ajax，服務(wù)端沒有展示：
（1）默認(rèn)Content-Type 為application/x-www-form-urlencoded：

        $.ajax({
           type: 'post',
            url: 'http://route.showapi.com/jiekou',
            dataType: 'json',
            data: {
                "showapi_appid": '666666', //這里需要改成自己的appid
                "showapi_sign": '67596029af7b4cb8bc7afe1c6ffd2333',  //這里需要改成自己的應(yīng)用的密鑰secret
                "page":"1",
                "maxResult":"20"

            },

            error: function(XmlHttpRequest, textStatus, errorThrown) {
                alert("操作失敗!");
            },
            success: function(result) {
                console.log(result) //console變量在ie低版本下不能用
                alert(result.showapi_res_code)
            }
        });

在chorme中調(diào)試顯示：

提交的原始數(shù)據(jù)

（2）content-type:application/json

var jsonstr={
"showapi_timestamp": formatterDateTime(),
"showapi_appid": '66666', //這里需要改成自己的appid
"showapi_sign": '67596029af7b4cb8bc7afe1c6ffd2333', //這里需要改成自己的應(yīng)用的密鑰secret
"page":"1",
"maxResult":"20"
}
$(function(){
$('#create-user').click(function(){
$.ajax({
type: 'post',
url: 'http://route.showapi.com/341-1',
dataType: 'json',
data: JSON.stringify(jsonstr), //轉(zhuǎn)換為json字符串
contentType:"application/json",
error: function(XmlHttpRequest, textStatus, errorThrown) {
alert("操作失敗!");
},
success: function(result) {
console.log(result) //console變量在ie低版本下不能用
alert(result.showapi_res_code)
}
});
});

在chorme中調(diào)試顯示：

客服端提交的原始數(shù)據(jù)：

補(bǔ)充知識點(diǎn)：
JSON字符串與JSON對象的區(qū)別
JSON對象:

var str2 = { "name": "cool", "sex": "man" };

JSON字符串:

var str1 = '{ "name": "haha", "sex": "woman" }';

js中如何轉(zhuǎn)換：
1、JSON字符串轉(zhuǎn)換為JSON對象

var obj = eval(‘(’ + str1+ ‘)’);//eval()函數(shù)是js自帶方法
var obj = JSON.parse(str1); //瀏覽器支持的轉(zhuǎn)換方式
var obj = $.parseJSON( str1);//jQuery方式
var obj = str1.parseJSON();//引用json.js

2、JSON對象轉(zhuǎn)換為JSON字符串

var s=JSON.stringify(str2); //瀏覽器支持的轉(zhuǎn)換方式
var s=str2.toJSONString(); //引用json.js