Ajax 學習筆記

2021-10-08 05:25:52 字數 3386 閱讀 7235

使用 ajax 傳送 get 請求的步驟

// 1、建立乙個非同步物件

// 2、設定請求方式和請求位址

// open(method, url, async)

// method:請求的型別:get 還是 post

// url:伺服器(檔案)位置

// async:true(非同步)或 false(同步)

)// 3、傳送請求

// 4、監聽狀態的變化

}}

對 ie 瀏覽器的相容

在建立非同步物件時,要注意相容 ie5、ie6

ie 快取問題

在 ie 瀏覽器中,如果通過 ajax 傳送 get 請求,那麼 ie 瀏覽器認為同乙個 url 只有乙個結果,即請求乙個位址後,位址內容發生變化,ajax 請求到的內容卻不會發生改變

解決方法:在請求路徑後拼接上時間戳

xhr.

open

("get"

,"04-ajax-get.php?t="+(

newdtae()

.gettime()

),true

)

ajax-get 封裝
解決了 ie 瀏覽器的相容,設定了超時時間,且將中文路徑轉換成字串。

在 url 中是不可出現中文的,如果出現中文就需要轉碼。

url 中只可以出現字母、數字、下劃線、ascii 碼

// 判斷外界是否傳入了超時時間

if(timeout)

, timeout)

}}使用 ajax 傳送 post 請求

ajax 傳送 post 請求與 傳送 get 請求步驟類似

新增請求頭

// 以下**必須放在 open 和 send 之間

xhr.

setrequestheader

("content-type"

,)

傳參方式

xhr.

send

("username=czt&userpwd=123"

)

ajax-post 封裝
function

// 判斷外界是否傳入了超時時間

if(timeout)

, timeout)

}}

cookie 基本使用
客戶端會話跟蹤技術。可以將網頁中的資料儲存在瀏覽器中。預設不會儲存任何資料。

儲存和獲取 cookie 資料的方法

// key 是要儲存資料的名稱   value 是對應的數值

document.cookie =

"key=value"

alert

(document.cookie)

cookie 的生命週期

其他注意點:

var date =

newdate()

// 設定過期時間為明天

date.

setdate

(date.

getdate()

+1)document.cookie =

"age=18;expires="

+ date.

togmtstring

()

cookie 方法的封裝

新增方法的封裝

function

addcookie

(key, value, day, path, domain)

else

}

獲取方法的封裝

function

getcookie()

}}

刪除方法的封裝

預設情況下只能刪除預設路徑中儲存的 cookie ,如果想要刪除指定路徑儲存的 cookie ,那麼必須在刪除時指定路徑才可以。

function

delcookie

(key, path)

Ajax學習筆記

send string string 僅用於post請求 使用get還是post 與post相比,get更簡單更快,大部分情況下使用 下面情況使用post請求 無法使用快取檔案 更新伺服器上的檔案或資料庫 向伺服器傳送大量資料 傳送包含未知字元的使用者輸入時,post更穩定和可靠 get請求例項 請...

ajax學習筆記

ajax學習 1 ajax的作用 ajax區域性重新整理技術,其實就是使用js實現區域性資料的實時變更 解決了不同響應之間資料共享的問題 優勢 提高了網路傳輸效率,提公升了使用者體驗 2 ajax的使用 建立ajax物件 瀏覽器差異問題 複寫onreadystatechange函式 接收響應結果 響...

ajax學習筆記

物件的建立 var xhr null if window.xmlhttprequest else或者使用try catch語句var xhr null trycatch e responsetext中的內容格式是字串window.onload function else trycatch e xhr...