網(wǎng)頁在我們網(wǎng)頁瀏覽中常用到的登錄,注冊或者搜索都是怎么完成的,想想已經(jīng)無法用事先寫好的靜態(tài)布局或者普通的JS語句來達(dá)到,在用戶瀏覽網(wǎng)頁過程中的一些操作可以通過后臺與服務(wù)器進(jìn)行少量數(shù)據(jù)交換,在不重新加載整個頁面的情況下勘纯,使得網(wǎng)頁實現(xiàn)異步更新,顯示新的內(nèi)容钓瞭。這就是——AJAX(異步的 JavaScript 和 XML)驳遵;
這里所提到的同步與異步就是程序中執(zhí)行操作的方式:同步是指在程序中一件事情做完再做下一件;異步則是同時處理多件事情山涡。
get與post
首先不得不先提一下html中的form
表單元素蠢正,form
提交的方式分為get
以及post
;
-
post
的提交數(shù)據(jù)的容量非常大船庇,安全性比起get直接顯示在地址欄也要高上不少赦抖,同時刷新頁面,不能從服務(wù)器獲取數(shù)據(jù); - 而
get
通過url
或者?提交,有著容量比較小鼠哥,通常是幾十K,不安全等特征看政;
這使得兩中提交方式在不同的場景起到獨有的作用肴盏。
JQuery中的Ajax
$.ajax({
url: //請求的地址
data:{} //提交的數(shù)據(jù)
dataType:'json' //請求的數(shù)據(jù)格式 默認(rèn)為字符串
cache: false //緩存 默認(rèn)true
success:function(){} //成功后的回調(diào)函數(shù)
error:function(){} //失敗后的回調(diào)函數(shù)
});
-
url
的值為鏈接到后臺接口的地址,get
提交的數(shù)據(jù)會跟在接口的帽衙?后面菜皂,數(shù)據(jù)以name=value&name=value
的形式,&為間隔提交厉萝;
1.5.data
的值包括以get
恍飘,或者post
方式提交的數(shù)據(jù)都以鍵值對的形式寫在這里; -
dataType
為請求所得數(shù)據(jù)的格式谴垫,json
并不是傳統(tǒng)意義上理解的純JSON格式章母,也可以兼容JSON+數(shù)組的寫法; -
cache
即緩存翩剪,在jQuery中設(shè)置了一個選項參數(shù)乳怎,其實其解決辦法為URL地址上加一個隨機(jī)數(shù)
url + 'r=' + Math.random()
-
success
即成功的回調(diào)函數(shù),其傳入的參數(shù)為Ajax的請求結(jié)果前弯; -
error
即失敗的回調(diào)函數(shù)蚪缀,也能得到Ajax的請求結(jié)果。
暫時就寫到這里恕出,關(guān)于JQuery中的Ajax已經(jīng)簡單介紹了一下询枚,而Ajax與Promise的配合,在AngularJS等框架中的表現(xiàn)浙巫,與nodeJS后臺的交互還有很多知識值得研究金蜀。