摘要：并且這個對象屬性和方法允許指定請求細節和提取響應數據。此請求不會被緩存。在發送完成請求以后，下一步將會取得響應。

腳本化HTTP
下面將會用js代碼操縱HTTP
下面將會說明在沒有導致web瀏覽器重新加載任何窗口或者窗體的情況下，腳本實現web瀏覽器和服務器之間的通信。
ajax：為一種找早起避免頁面重載而動態更新頁面的方式，不過現在是直接數據驅動，或者類似于vue的單頁應用
comet：這個和ajax正好相反，為推送消息到web瀏覽器端

ps；ajax和comet都為一個美國的洗滌日用品牌，╮(╯▽╰)╭

img元素有一個src屬性，當腳本設置img元素的src屬性，且把信息作為圖片的url的查詢字符串部分，即能把經過編碼的信息椽筆給web服務器，web服務器實際上必須返回一個圖片作為結果。
事實上，使用一個空的js腳本也可完成此操作
一個百度統計的js腳本如下

(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?d2539dae35b4dcf0e7814c110ecefa9f";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();

分析，一個采用es5編寫的一個閉包，動態加載一個script標簽，向https://hm.baidu.com/hm.js?d2...，并且查詢的字符串為？后面的參數，服務器只需要統計？后面的get請求數目，即可完成一次次的統計任務。用戶的頁面停留，直接計算兩次加載的時間差即可。數據庫完成統計即可。一個最簡單的頁面統計完成。

一個淘汰的標簽。
下面是舊的ajax方式
使用iframe完成一次ajax，腳本先把要發送給web服務器的信息編碼到url中，服務器在動態的創建一個html文檔，將其內容返回給web，在iframe中顯示，這種方式受道同源的限制。
上方的方式以及放棄。

通過script元素的src屬性設置url發起http get請求，即一種基于script的ajax傳輸，服務器使用json編碼，執行腳本的時候，將其轉碼，這種的ajax同時也稱為jsonp
即這種的跨域可以不受到同源的限制

ajax中的x為xml為一種可選的通信方式，也可以使用JSON完成通信。

一些更多的通信協議，包括rpc（遠程過程調用）允許運行于一臺計算機的程序調用另一臺計算機程序的子程序。如果面向對象編程，則遠程過程調用為遠程調用，遠程方法調用。

一種設計模式，有兩種，一種是觀察者模式，一種是發布訂閱模式，
即，消息推送使用的是發布/訂閱事件系統

意圖：定義對象間的一對多的依賴關系，當一個對象狀態發生改變時，所有依賴它的對象都得到通知，并進行更新
解決：一個對象狀態給其他對象通知的問題，
舉例應用：有個天氣中心的目標A，專門監聽天氣的變化，而有個顯示天氣的觀察者B，B把自己注冊到A里，當A觸發天氣變化的時候，調度B更新方法，并帶上自己的上下文。

訂閱者把自己想注冊的事件注冊到調度中心，當該事件觸發時，發布者發布事件到調度中心，由調度中心統一調度訂閱者注冊到調度中心的處理代碼。
舉例：有個界面實時顯示天氣，它就訂閱天氣事件（注冊到調度中心），當天氣變化時定時獲取數據，作為發布者到調度中心，調度中心調度訂閱者的天氣處理程序。

一個為點對點，一個為中間有一個過渡的，僅此而已。

ps 有一本書js的設計模式，推薦看看 http://shop.oreilly.com/produ...  以及 https://addyosmani.com/resour...
購買 https://www.amazon.com/_/dp/1...
很想知道有木有中文版的。吐槽 28美元，合計120多元，書怎么那么貴呢。好貴，建議注冊一下

瀏覽器在CMLHttpRequest類上定義了其HTTP 的API 這個類的每個實例都表示一個獨立請求/響應對。并且這個對象屬性和方法允許指定請求細節和提取響應數據。

同java類似，使用這個api的第一件事實例化XMLHttpRequest對象

ps：能重用已存在的XMLHttpRequest 但是之前的對象將會被掛起

http請求方法或者動作

正在請求的URL

一個可選的請求頭集合，其中可能包含身份驗證信息

一個可選的請求主題

一個數字和文字組合成的狀態碼，如404（表示不存在）

一個響應頭集合

響應主體

在本地寫js的時候，必須搭建一個服務器其AJAX才能工作
原因：因為文件的協議為file而本地的請求的協議為http，由于同源策略的影響，導致無法使用http協議的文件，故本地無法直接使用ajax

解決方法，chrome的瀏覽器訪問https://chrome.google.com/web... 安裝chrome官方提供的本地測試服務器，用于在本地搭建服務器。
或者，編寫Node.js 使用Express框架，加載Static 模塊，完成本地的靜態服務器搭建。

指定請求使用的是request.open()，此方法將會初始化一個請求從js代碼中調用。
第一個參數指定HTTP方法或動作，字符串不區分大小寫，通常用大寫字母匹配HTTP協議，GET用于常規請求，適用于當URL完全指定請求資源。當請求對服務器沒有任何副作用以及當服務器的響應可緩存的時候，使用GET。對于POST來說，常常用于HTML表單，它在請求主體中包含額外數據，即表單數據，且這些數據常常儲存到服務器的數據庫中。此請求不會被緩存。
同樣的，還允許其他的一些請求，例如DELETE，HEAD，OPTIONS，PUT等請求。
第二個參數為URL，為請求的主體，相對于文檔的URL，這個文檔包含調用open()的腳本，這個不能跨域，請求必須為同域的

request.setRequestHeader("Content-type", "text/plain");

下面將會設置請求頭，上方設置請求頭為Content-type的內容為text/plain

有些請求頭由于瀏覽器的安全問題，被禁止請求，所以有些不能請求。

如果請求一個受到密碼保護的url，此時不需要設置Authorization頭，只需要直接在open的第三四個參數，傳入即可。

由于get請求不包括主體，則直接send方法即可完成一個包的發送，

在http://1.197.156.53/編寫js如下

// 編寫請求頭GET并完成發送
var request = new XMLHttpRequest();    // 設置請求的類
request.open("GET", "https://www.baidu.com/");    // 設置請求的鏈接和方式
request.setRequestHeader("Content-Type", "text/plain");    // 設置請求頭
request.send(null);    // 發送包

跨域請求被攔截。
由于不是同源，同源被攔截

// 編寫請求頭GET并完成發送
var request = new XMLHttpRequest();    // 設置請求的類
request.open("GET", "./index.js");    // 設置請求的鏈接和方式
request.setRequestHeader("Content-Type", "text/plain");    // 設置請求頭
request.send(null);    // 發送包

完成一次發包操作

HTTP請求的各個部分有指定的順序，請求方法和URL會首先到達，然后接著請求頭，最后請求主體。最后調用send()方法，完成發送。
順序問題:必須先調用open后調用send()才方可。

function postMessage(msg) {
    var request = new XMLHttpRequest();    // 新請求
    request.open("post", "/log.php");    // 用POST向服務器端發送腳本
    // 用請求主體發送純文本消息
    request.setRequestHeader("Content-Type", "text.plain;charset=utf-8");    // 請求主體將是純文本

    request.send(msg);
    // 請求完成，我們將忽略任何響應和任何錯誤
}

即上方定義了一個post請求，完成其發送，等待其服務器響應

send()發送以后將會等待服務器響應，此時將不會阻塞。
在HTTP發送完成請求以后，下一步將會取得響應。
下面編寫函數獲取HTTP響應的onreadystatechange

// 發出一個HTTP GET請求獲取指定的URL的內容
// 當響應成功到達，驗證它是否是純文本
// 如果是，將會把它傳遞給指定的回調函數
function getText(url, callback) {
    var request = new XMLHttpRequest();    // 創建一個新請求
    request.open("GET", url);    // 創建一個指定待獲取的url
    request.onreadystatechange = () => {    // 當GRT請求完成以后，觸發該事件，產生回調函數
        // 如果請求完成，則它是成功的
        if (request.readyState === 4 && request.status === 200){    // 如果下載操作完成，即為4，并且http狀態碼為200
            var type = request.getResponnseHeader("Content-Type");    // 獲取HTTP頭部信息
            if (type.match(/^text/))    //正則匹配，確定響應為文本
                callback(request.responseText);    // 回調函數,將返回的DOM樹，傳遞給回調函數
        }
    };

    request.send(null);    // 發送
}

注意，該方式為異步的，send方法不會阻塞其他操作

由于其下載的問題，一般異步處理HTTP響應，但是同步也可以，不過由于客戶端js為單線程的，當send()方法阻塞以后，將會導致瀏覽器的ui被凍結，如果連接的服務器過慢，將會導致用戶的操作出現問題。

方法直接open使用第三個參數為false

當服務器響應的為XML文檔的時候，其返回的值為document對象，能使用操作節點的方式，對其進行操作
當服務器發送對象或者數組的結構化數據，如JSON，

使用JSON.parse 對結構化數據進行解析

下方書寫一個函數，進行結構化數據的解析

// 發起HTTP GET響應，獲得指定的URL內容
// 當響應到達時，把他們解析后的XML Document對象，解析后的JSON對象
// 或者字符串形式傳遞給回調函數
function get(url, callback){
    var request = new XMLHttpRequest();
    request.open("GET", url);    // 指定url
    request.onreadystatechange = () => {    // 監聽器
        // 如果請求完成且成功
        if (request.readyState === 4 && request.status === 200) {
            // 獲得響應請求
            var type = request.getResponseHeader("Content-Type");
            // 檢查類型
            // 當為xml的時候
            if (type.indexOf("xml") !== -1 && request.responseXML)    // 確認是否為xml
                calback(request.responseXML);    // 回調函數
            else if (type === "application/json")    // 如果頭部的信息為JSON
                callback(JSON.parse(request.responseText));    // 將結果JSON格式解析
            else 
                callback(request.responseText);    // 如果是字符串響應
        }
    };
    request.send(null);    // 立即發送請求
}

對兩種數據解析，一種為JSON格式，一種為XML格式

ps 不建議使用eval
ps 由于跨域的問題，只能讀取同源的數據，通過script腳本操縱HTTP腳本并實現加載并執行腳本
script 元素能發起跨域的HTTP請求

能使用request.overrideMimeType能夠實現對MIME類型的更改