站長資訊網(wǎng)
AJAX是一種用于創(chuàng)建快速動態(tài)網(wǎng)頁的技術，可以用來：1、做局部請求以實現(xiàn)局部刷新（不刷新頁面而更新網(wǎng)頁）；2、在頁面加載后從服務器請求數(shù)據(jù)；3、在頁面加載后從服務器接收數(shù)據(jù)；4、在后臺向服務器發(fā)送數(shù)據(jù)。
本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。
Ajax是什么？
AJAX = Asynchronous JavaScript and XML.
AJAX是一種用于創(chuàng)建快速動態(tài)網(wǎng)頁的技術。
AJAX 通過在后臺與服務器進行少量數(shù)據(jù)交換，使網(wǎng)頁實現(xiàn)異步更新。這意味著可以在不重載整個頁面的情況下，對網(wǎng)頁的某些部分進行更新。
傳統(tǒng)的網(wǎng)頁（不使用 AJAX）如果需要更新內容，必須重載整個頁面。
有很多使用 AJAX 的應用程序案例：Google Maps、Gmail、Youtube 和 Facebook。
用于瀏覽器與服務器之間使用異步數(shù)據(jù)傳輸(HTTP 請求)，做到局部請求以實現(xiàn)局部刷新
Ajax是干什么的？有什么用？
1、不刷新頁面而更新網(wǎng)頁(局部刷新)
2、在頁面加載后從服務器請求數(shù)據(jù)
3、在頁面加載后從服務器接收數(shù)據(jù)
4、在后臺向服務器發(fā)送數(shù)據(jù)
如何使用Ajax？
1、創(chuàng)建XMLHttpRequest對象
2、使用open方法設置和服務器的交互信息
3、設置requestHeader() request.setRequestHeader(屬性名稱, 屬性值);
4、send() 設置發(fā)送的數(shù)據(jù)，開始和服務器端交互
5、取得響應，注冊事件
例子：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <button onclick="getData()">獲取數(shù)據(jù)</button> <script> function getData() { // 1.創(chuàng)建XMLHttpRequest對象 var request = new XMLHttpRequest(); // 2.使用open方法設置和服務器的交互信息 // 請求的主體 request.open('get', 'https://api.muxiaoguo.cn/api/lishijr/') // 3.設置requestHeader() request.setRequestHeader(屬性名稱, 屬性值); // 這里用默認就好，不寫了 // 4. send() 設置發(fā)送的數(shù)據(jù)，開始和服務器端交互 request.send(); //調用send()之后,請求就會發(fā)送到服務器 // 5.取得響應，注冊事件 request.onreadystatechange = function () { if (request.readyState === 4 && request.status === 200) { //4 響應完成 DONE // console.log(request.responseText); var res = JSON.parse(request.responseText); console.log(res); // 根據(jù)數(shù)據(jù)添加對應的節(jié)點 for (var arrIndex in res.data) { // 創(chuàng)建一個節(jié)點 var p = document.createElement('p'); p.innerHTML = res.data[arrIndex].title; document.body.appendChild(p); } } } // 6.如果請求完成，并且響完成，可以獲取到響應數(shù)據(jù) } </script> </body> </html>
對AJAX的總結：
AJAX是異步的JavaScript和XML;
AJAX是一種用于創(chuàng)建更好更快以及交互性更強的Web應用程序的技術;
AJAX是一種獨立于Web服務器軟件的瀏覽器技術;
AJAX不是一種新的編程語言，而是一種技術;
AJAX 使用 JavaScript 在 web 瀏覽器與 web 服務器之間來發(fā)送和接收數(shù)據(jù)（前端后端交互）;
AJAX在瀏覽器與Web服務器之間使用異步數(shù)據(jù)傳輸（HTTP請求）。
【相關教程推薦：AJAX視頻教程】
