好程式設計師web前端學習路線分享瞭解AJAX是什麼

好程式設計師web 前端學習路線分享瞭解 AJAX 是什麼首先是伺服器

 

什麼是伺服器：我們們的頁面來源於伺服器；例項（在phpnwo上面存放一個頁面），

我們們把頁面放在網際網路的伺服器上，就有了自己的網站了。

 

1.非同步同步

 

生活中的同步： 

 

生活中的非同步：

在JavaScript語言中，同步和非同步的概念剛好相反。

 

這JavaScript中同步就是：你不執行完上面的程式碼，那麼下面的程式碼你就別執行；一步一步執行，這就是同步。

 

非同步就是可以一塊執行的程式碼；

 

程式的概念

 

    程式 ≠程式

 

    程式從開始到結束的一次執行過程叫做程式

 

    一個程式當中，程式同時執行的多個分支，叫做執行緒

 

    多執行緒非同步執行，可以提高程式的效率

 

 

AJAX的重要性

 

在許多數企業看來AJAX的使用熟練程度 === 你的工作經驗。

 

2.什麼是AJAX

 

ajax是前後端資料互動的重要手段

 

Ajax 全稱為：“Asynchronous JavaScript and XML”（非同步 JavaScript 和 XML）， 它並不是 JavaScript 的一種單一技術，而是利用了一系列互動式網頁應用相關的技術所形 成的結合體。使用 Ajax，我們可以無重新整理狀態更新頁面，並且實現非同步提交，提升了使用者體驗。

 

一．Ajax 概述

 

Ajax 這個概念是由 JesseJamesGarrett 在 2005 年發明的。它本身不是單一技術，是一串 技術的集合，主要有：

 

1.JavaScript，透過使用者或其他與瀏覽器相關事件捕獲互動行為

 

2.XMLHttpRequest 物件，透過這個物件可以在不中斷其它瀏覽器任務的情況下向服務 器傳送請求；

 

3.伺服器上的檔案，以 XML、HTML 或 JSON 格式儲存文字資料；

 

4.其它 JavaScript，解釋來自伺服器的資料（比如 PHP 從 MySQL 獲取的資料）並將其 呈現到頁面上。

 

由於 Ajax 包含眾多特性，優勢與不足也非常明顯。優勢主要以下幾點：

 

1.不需要外掛支援（一般瀏覽器且預設開啟 JavaScript 即可）；

 

2.使用者體驗極佳（不重新整理頁面即可獲取可更新的資料）；

 

3.提升 Web 程式的效能（在傳遞資料方面做到按需放鬆，不必整體提交）；

 

4.減輕伺服器和頻寬的負擔（將伺服器的一些操作轉移到客戶端）；

 

而 Ajax 的不足由以下幾點：

1.不同版本的瀏覽器度 XMLHttpRequest 物件支援度不足(比如 IE5 之前)；

2.前進、後退的功能被破壞（因為 Ajax 永遠在當前頁，不會機率前後頁面）；

3.搜尋引擎的支援度不夠（因為搜尋引擎爬蟲還不能理解 JS 引起變化資料的內容）；

 

4.開發除錯工具缺乏（相對於其他語言的工具集來說，JS 或 Ajax 除錯開發少的可憐） 。

 

3.AJAX的使用

 

電話的接打順序：

1.首先要有一個電話；

 

2.撥號；

 

3.說話；

 

4.聽電話另一邊的資訊；

 

//有一個電話：建立請求物件；

 

1.var AJAX=new XMLHttpRequest( );

 

//撥號：設定請求引數；

 

2.AJAX.open('get','data/test.json',true);

 

第一個引數：POST||GET

 

POST和GET的區別

 

 

POST是傳送資料，GET是接受資料；

 

PSOT傳送資料的安全性較好，而GET較差；

 

POST傳送資料不限制大小，而GET大小受限2~100k。

 

什麼時候用GET和POST那：在資料獲取時用GET方式，在運算元據時應使用POST方式。

 

第三個引數：當該boolean值為true時，伺服器請求是非同步進行的，也就是指令碼執行send（）方法後不等待

 

伺服器的執行結果，而是繼續執行指令碼程式碼；

 

當該boolean值為false時，伺服器請求是同步進行的，也就是指令碼執行send（）方法後等待

 

伺服器的執行結果的返回，若在等待過程中超時，則不再等待，繼續執行後面的指令碼程式碼！

 

3. ajax.>

    {

        if (ajax.readyState == 4 && ajax.status == 200)

        {

            func_succ(ajax.responseText);

        }

        else

        {

            //alert("ajax faild readyState:"+ajax.readyState+" status:"+ajax.status);

        }

    };

4.ajax.send(null);

 

ajax.readyStatus

 

0 － （未初始化）還沒有呼叫send()方法

 

1 － （載入）已呼叫send()方法，正在傳送請求

 

2 － （載入完成）send()方法執行完成，已經接收到全部響應內容

 

3 － （互動）正在解析響應內容

 

4 － （完成）響應內容解析完成，可以在客戶端呼叫了