好程序員Java學(xué)習(xí)路線分享原生Ajax的使用

好程序員Java學(xué)習(xí)路線分享原生Ajax的使用，首先我們先來(lái)看一下什么是 AJAX

10年的清原網(wǎng)站建設(shè)經(jīng)驗(yàn)，針對(duì)設(shè)計(jì)、前端、開發(fā)、售后、文案、推廣等六對(duì)一服務(wù)，響應(yīng)快，48小時(shí)及時(shí)工作處理。營(yíng)銷型網(wǎng)站建設(shè)的優(yōu)勢(shì)是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動(dòng)調(diào)整清原建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無(wú)論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計(jì)，從而大程度地提升瀏覽體驗(yàn)。成都創(chuàng)新互聯(lián)公司從事“清原網(wǎng)站設(shè)計(jì)”,“清原網(wǎng)站推廣”以來(lái)，每個(gè)客戶項(xiàng)目都認(rèn)真落實(shí)執(zhí)行。

????????AJAX 是一種在無(wú)需重新加載整個(gè)網(wǎng)頁(yè)的情況下，能夠更新部分網(wǎng)頁(yè)的技術(shù)。

????????AJAX 就是 異步、JavaScript 和 XML。

????????AJAX 是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁(yè)的技術(shù)。

????????通過(guò)在后臺(tái)與服務(wù)器進(jìn)行少量數(shù)據(jù)交換，AJAX 可以使網(wǎng)頁(yè)實(shí)現(xiàn)異步更新。這意味著可以在不重新加載整個(gè)網(wǎng)頁(yè)的情況下，對(duì)網(wǎng)頁(yè)的某部分進(jìn)行更新。

????????傳統(tǒng)的網(wǎng)頁(yè)（不使用 AJAX）如果需要更新內(nèi)容，必需重載整個(gè)網(wǎng)頁(yè)面。

AJAX 工作原理

????Browser瀏覽器 ???????????Server服務(wù)器

????發(fā)起事件

????創(chuàng)建XMLHttpRequest對(duì)象

????發(fā)送請(qǐng)求 ???????????????

????????????????????????????接收客戶端發(fā)送的對(duì)象

????????????????????????????回復(fù)一個(gè)ResponseText對(duì)象

????接收ResponseText結(jié)果

????更新頁(yè)面局部數(shù)據(jù)

??????????????????????????????????????????????????????

XMLHttpRequest 對(duì)象

????XMLHttpRequest 是 AJAX 的基礎(chǔ)。

????所有現(xiàn)代瀏覽器均支持 XMLHttpRequest 對(duì)象（IE5 和 IE6 使用 ActiveXObject）。

????XMLHttpRequest 用于在后臺(tái)與服務(wù)器交換數(shù)據(jù)。這意味著可以在不重新加載整個(gè)網(wǎng)頁(yè)的情況下，對(duì)網(wǎng)頁(yè)的某部分進(jìn)行更新。

創(chuàng)建 XMLHttpRequest 對(duì)象

????所有現(xiàn)代瀏覽器（IE7+、Firefox、Chrome、Safari 以及 Opera）均內(nèi)建 XMLHttpRequest 對(duì)象。

????創(chuàng)建 XMLHttpRequest 對(duì)象的語(yǔ)法：

????variable=new XMLHttpRequest();

????為了應(yīng)對(duì)所有的現(xiàn)代瀏覽器，包括 IE5 和 IE6，請(qǐng)檢查瀏覽器是否支持 XMLHttpRequest 對(duì)象。如果支持，則創(chuàng)建 XMLHttpRequest 對(duì)象。如果不支持，則創(chuàng)建 ActiveXObject ：

????**實(shí)例**

????var xmlhttp;

????if (window.XMLHttpRequest)

????{

????????// ?IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執(zhí)行代碼

????????xmlhttp=new XMLHttpRequest();

????}

????else

????{

????????// IE6, IE5 瀏覽器執(zhí)行代碼

????????xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

????}

AJAX - 向服務(wù)器發(fā)送請(qǐng)求請(qǐng)求

????XMLHttpRequest 對(duì)象用于和服務(wù)器交換數(shù)據(jù)。

????向服務(wù)器發(fā)送請(qǐng)求

????????如需將請(qǐng)求發(fā)送到服務(wù)器，我們使用 XMLHttpRequest 對(duì)象的 open() 和 send() 方法：

????????????xmlhttp.open("GET","ajax_info.txt",true);

????????????xmlhttp.send();

????open(method,url,async) 規(guī)定請(qǐng)求的類型、URL 以及是否異步處理請(qǐng)求。

????????method：請(qǐng)求的類型；GET 或 POST

????????url：文件在服務(wù)器上的位置

????????async：true（異步）或 false（同步）

????send(string) 將請(qǐng)求發(fā)送到服務(wù)器。

????????string：僅用于 POST 請(qǐng)求

GET 還是 POST？

????與 POST 相比，GET 更簡(jiǎn)單也更快，并且在大部分情況下都能用。

????然而，在以下情況中，請(qǐng)使用 POST 請(qǐng)求：

????????無(wú)法使用緩存文件（更新服務(wù)器上的文件或數(shù)據(jù)庫(kù)）

????????向服務(wù)器發(fā)送大量數(shù)據(jù)（POST 沒有數(shù)據(jù)量限制）

????????發(fā)送包含未知字符的用戶輸入時(shí)，POST 比 GET 更穩(wěn)定也更可靠

**GET 請(qǐng)求**

????

????xmlhttp.open("GET","/try/ajax/demo_get.php",true);

????xmlhttp.send();

????如果您希望通過(guò) GET 方法發(fā)送信息，請(qǐng)向 URL 添加信息：

????xmlhttp.open("GET","/try/ajax/demo_get2.php?fname=Henry&lname=Ford",true);

xmlhttp.send();

**POST 請(qǐng)求**

????

????一個(gè)簡(jiǎn)單 POST 請(qǐng)求：

????xmlhttp.open("POST","/try/ajax/demo_post.php",true);

????xmlhttp.send();

????

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

????xmlhttp.open("POST","/try/ajax/demo_post2.php",true);

????xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

????xmlhttp.send("fname=Henry&lname=Ford");

AJAX - 服務(wù)器 響應(yīng)

????請(qǐng)規(guī)定在響應(yīng)處于 onreadystatechange 事件中的就緒狀態(tài)時(shí)執(zhí)行的函數(shù)：

????服務(wù)器響應(yīng)如需獲得來(lái)自服務(wù)器的響應(yīng)，請(qǐng)使用 XMLHttpRequest 對(duì)象的 responseText 或 responseXML 屬性。

????responseText 獲得字符串形式的響應(yīng)數(shù)據(jù)。

????responseXML 獲得 XML 形式的響應(yīng)數(shù)據(jù)。

名稱欄目：好程序員Java學(xué)習(xí)路線分享原生Ajax的使用
網(wǎng)站鏈接：http://muchs.cn/article2/gjchic.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供用戶體驗(yàn)、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)公司、網(wǎng)站內(nèi)鏈、關(guān)鍵詞優(yōu)化、定制網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)