粗談對ajax的理解

ajax:
 Asynchronous JavaScript and XML
 異步JavaScript和XML技術
 Asynchronous:
 JavaScript:XMLHttpRequest
 XML:實現(xiàn)數(shù)據(jù)存儲和交換 ----- JSON
 特點:
 AJAX 是與服務器交換數(shù)據(jù)并更新部分網(wǎng)頁的藝術,在不重新加載整個頁面的情況下。
 不重新加載整個頁面的情況下實現(xiàn)頁面局部內容的刷新(無刷新技術--局部刷新)
 有效利用帶寬

 不利于SEO

ajax的使用有四個步驟:

    a.創(chuàng)建核心對象:

        var xhr = new XMLHttpRequest();

    b.準備建立連接

        xhr.open(method,url,async);

                method--發(fā)起請求的方法(POST|GET)

                url--發(fā)起請求的目標地址

                async--是否異步處理

    c.發(fā)送請求

        xhr.send();

    d.處理響應

        xhr.onreadystatechange = function(){}

ajax中常見的屬性:

xhr.readyState:就緒狀態(tài)碼,存有 XMLHttpRequest 的狀態(tài)信息,(請求到達哪個階段)
 0 -- 請求未初始化
 1 -- 建立連接
 2 -- 接收到請求
 3 -- 請求處理過程中
 4 -- 請求處理完畢,響應就緒
xhr.status:HTTP狀態(tài)碼
 1xx:消息
 2xx:成功 200-OK
 3xx:重定向
 4xx:客戶端錯誤
 5xx:服務器端錯誤

xhr.responseText:響應文本


如果需要像 HTML 表單那樣 POST 數(shù)據(jù),請使用 setRequestHeader() 來添加 HTTP 頭。然后在 send() 方法中規(guī)定您希望發(fā)送的數(shù)據(jù):

    xml.open("POST","ajax_test.asp",true);
    xml.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xml.send("fname=Bill&lname=Gates");


歡迎關注微信公眾號:猴哥說前端