狠狠躁日日躁夜夜躁A片无码,中文字幕在线亚洲二区,最近更新中文字幕在线,四虎影视国产精品亚洲精品,男人扒开添女人下部免费视频

傳統(tǒng)開發(fā)的缺點，是對于瀏覽器的頁面，全部都是全局刷新的體驗。如果我們只是想取得或是更新頁面中的部分信息那么就必須要應用到局部刷新的技術。

局部刷新也是有效提升用戶體驗的一種非常重要的方式。

Ajax技術是基于js語言的擴展，能夠通過將請求發(fā)送給后臺，并從后臺取得相關數據，然后將數據在頁面做局部刷新的重要技術。

本教程會通過對ajax的傳統(tǒng)使用方式，結合json操作的方式，結合跨域等高級技術的方式，對ajax做一個全面的講解。

什么是Ajax？

AJAX ＝ Asynchronous JavaScript and XML（異步的 JavaScript 和XML）。

AJAX 是一種在無需重新加載整個網頁的情況下，能夠更新部分頁面內容的新方法

AJAX 不是新的編程語言，而是使用現有技術混合使用的一種新方法。ajax 中使用的技術有JavaScript， html ， dom ， xml ，css 等。主要是JavaScript ， XML．

JavaScript： 使用腳本對象XMLHttpRequest 發(fā)送請求， 接收響應數據XML： 發(fā)送和接收的數據格式，現在使用json

AJAX 不單需要前端的技術，同時需要后端（服務器）的配合。服務器需要提供數據，數據是AJAX 請求的響應結果。

全局刷新和局部刷新

B／S 結構項目中， 瀏覽器（Browse）負責把用戶的請求和參數通過網絡發(fā)送給服務器（Server），服務端使用 Servlet（多種服務端技術的一種）接收請求，并將處理結果返回給瀏覽器。

瀏覽器在html，jsp 上呈現數據，混合使用css， js 幫助美化頁面，或響應事件。

全局刷新

登錄請求處理：

index．jsp 發(fā)起登錄請求－－－－－－－－LoginServlet result．jsp

發(fā)起請求request 階段：

瀏覽器現在內存中是index 頁面的內容和數據 ：

服務器端應答結果階段：

sevlet 返回后把數據全部覆蓋掉原來index 頁面內容， result．jsp 覆蓋了全部的瀏覽器內存數據。 整個瀏覽器數據全部被刷新。重新在瀏覽器窗口顯示數據，樣式，標簽等

全局刷新原理：

1） 必須由瀏覽器親自向服務端發(fā)送請求協(xié)議包。

2） 這個行為導致服務端直接將【響應包】發(fā)送到瀏覽器內存中

3） 這個行為導致瀏覽器內存中原有內容被覆蓋掉

4） 這個行為導致瀏覽器在展示數據時候，只有響應數據可以展示

局部刷新

瀏覽器在展示數據時，此時在窗口既可以看到本次的響應數據， 同時又可以看到瀏覽器內存中原有數據

局部刷新原理：

1） 不能由瀏覽器發(fā)送請求給服務端

2） 瀏覽器委托瀏覽器內存中一個腳本對象代替瀏覽器發(fā)送請求．

3） 這個行為導致導致服務端直接將【響應包】發(fā)送腳本對象內存中

4） 這個行為導致腳本對象內容被覆蓋掉，但是此時瀏覽器內存中絕大部分內容沒有收到任何影響

5） 這個行為導致瀏覽器在展示數據時候，同時展示原有數據和響應數據

AJAX 實現局部刷新的一種技術。

異步請求對象：

在局部刷新，需要創(chuàng)建一個對象，代替瀏覽器發(fā)起請求的行為，這個對象存在內存中。

代替瀏覽器發(fā)起請求并接收響應數據。這個對象叫做異步請求對象。

全局刷新是同步行為， 局部刷新是異步行為［瀏覽器數據沒有全部更新］ 這個異步對象用于在后臺與服務器交換數據。XMLHttpRequest 就是我們說的異步對象。

XMLHttpRequest 對象能夠：

在不重新加載頁面的情況下更新網頁

在頁面已加載后向服務器請求數據

在頁面已加載后從服務器接收數據

所有現代瀏覽器 （IE7＋、Firefox、Chrome、Safari 以及 Opera） 都內建了 XMLHttpRequest 對象。通過一行簡單的 JavaScript 代碼，我們就可以創(chuàng)建 XMLHttpRequest 對象

創(chuàng)建 XMLHttpRequest 對象的語法（xhr）： var xmlhttp＝new XMLHttpRequest（）；

AJAX 中的核心對象就是XMLHttpRequest

AJAX 異步實現步驟

XMLHttpRequest 對象介紹

（1） 創(chuàng)建對象方式

var xmlHttp ＝ new XMLHttpRequest（）；

（2） onreadstatechange 事件

當請求被發(fā)送到服務器時，我們需要執(zhí)行一些基于響應的任務。每當readyState 改變時，就會觸發(fā) onreadystatechange 事件。此事件可以指定一個處理函數function。

通過判斷XMLHttpReqeust 對象的狀態(tài)，獲取服務端返回的數據。

語法：

xmlHttp．onreadystatechange＝ function（） ｛

if（ xmlHttp．readyState ＝＝ 4 ＆＆ xmlHttp．status ＝＝ 200）｛

處理服務器返回數據

｝

｝

下面是 XMLHttpRequest 對象的三個重要的屬性：

屬性說明：

onreadystatechange 屬性：一個 js 函數名 或 直接定義函數，每當readyState 屬性改變時，就會調用該函數

readyState 屬性：

存有 XMLHttpRequest 的狀態(tài)。從 0 到 4 發(fā)生變化。

? 0： 請求未初始化，創(chuàng)建異步請求對象 var xmlHttp ＝ new XMLHttpRequest（）

? 1： 初始化異步請求對象， xmlHttp．open（請求方式，請求地址，true）

? 2： 異步對象發(fā)送請求， xmlHttp．send（）

? 3： 異步對象接收應答數據 從服務端返回數據。XMLHttpRequest 內部處理。

? 4： 異步請求對象已經將數據解析完畢。 此時才可以讀取數據。