2019-8-5 seo達人
如果您想訂閱本博客內容，每天自動發到您的郵箱中， 請點這里
把項目放在wampserver的www目錄下，啟動wampserver，并且瀏覽器打開后手動修改url為localhost
index.js=》getData():
ajax.js以及index。js對它的調用:
ajax的參數：method、data、url都是字符串
index.js =》getData（）=》調用ajax
ajax('GET', 'http://localhost/web/ajax/waterfall2/src/js/getPics.php', addDom, 'cpage=' + num, true)
并且url是localhost下——localhost/web/ajax/waterfall2/src/js/getPics.php
不是直接圖片資源地址
圖片資源地址寫在php中，只管調用就行
data：
ajax調用是data是這樣的=》'cpage=' + num
測試用的data.txt：
一個數組里有很多對象，每個對象都是一張圖片的全部信息，每條信息都是json.stringify格式
所以測試用ajax的callback這樣寫：
function addDom(data) {
console.log(JSON.parse(data));
}
這個data不是自己定義的，是xhr.responseText，是接口的數據
這個data是callback的參數
回調函數的data參數和使用方法：
xhr.onreadystatechange = function() {
////////狀態改變
if(xhr.readyState == 4) {
if(xhr.status == 200) {
callback(xhr.responseText);
////////滿足兩個條件時,callback才獲取數據成功，才能用數據做些什么
}else {
console.log('error');
}
}
}
ajax（）中callback是參數，而callback的定義和對數據的操作通常在ajax（）調用之后
例如:
(1)
ajax('GET', 'http://localhost/web/ajax/waterfall2/src/js/data.txt', addDom, 'cpage=2', true);
function addDom(data) {
console.log(JSON.parse(data));
}
如此簡單明了
(2)
function getData() {
// if(!flag) {
// flag = true;
// ajax('GET', 'http://localhost/web/ajax/waterfall2/src/js/getPics.php', addDom, 'cpage=' + num, true)
// num++;
// }
// }
// getData();
// function addDom(data) {
……
}
回來…………
ajax中的data在本例中是字符串'cpage=' + num 或者 'cpage=2'這種
get中作用:
xhr.open(method, url + '?' + data + '&timer=' + timer, flag);
post中作用:
xhr.send(data);
話說回來…………
都是獲取數據，data.txt和getPics.php區別:
一個只有第2頁的地址，一個是動態獲取很多頁數據
反正就那么傳吧
而ajax
藍藍設計( www.wtxcl.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。