不需要外掛程式的支援,原生 js 就可以使用
使用者體驗好(不需要重新整理頁面就可以更新資料)
減輕服務端和頻寬的負擔
缺點: 搜尋引擎的支援度不夠,因為資料都不在頁面上,搜尋引擎搜尋不到
// ie9及以上
// ie9以下
// xhr 物件中的 open 方法是來配置請求資訊的
// 第乙個引數是本次請求的請求方式 get / post / put / ...
// 第二個引數是本次請求的 url
// 第三個引數是本次請求是否非同步,預設 true 表示非同步,false 表示同步
// xhr.open('請求方式', '請求位址', 是否非同步)
)// 使用 xhr 物件中的 send 方法來傳送請求
xhr.
send
()
這個時候我們就會發現,當乙個 ajax 請求的全部過程中,只有當readystate === 4
的時候,我們才可以正常使用服務端給我們的資料
所以,配合 http 狀態碼為 200 ~ 299
兩個條件都滿足的時候,才是本次請求正常完成
我們管觸發了同源策略的請求叫做跨域請求
所以我們就可以利用這個script
標籤的src
屬性來進行跨域請求了
Ajax簡單原生使用原理
let xhr 由於存在相容問題,所以需要判斷是dom瀏覽器還是ie瀏覽器 第乙個引數 是get還是post請求,第二個引數,伺服器需要攔截的路由,第三個引數,ajax是否非同步,true為非同步,false為同步xhr.send null get請求 xhr.send options post請求...
原生Ajax的原理和實現
核心 xmlhttprequest物件 xhr xhr.timeout 1000 設定超時時間 ms xhr.ontimeout function xhr.setrequestheader header,value 設定http頭部資訊 get xhr.open get url,isasync xh...
原生ajax解析 封裝原生ajax函式
前沿 對於此篇隨筆,完是簡要寫了幾個重要的地方,具體實現細節完在提供的原始碼做了筆記 一 ajax基本要點介紹 更好的介紹ajax 1.ajax物件中new xmlhttprequest 屬性和方法列表 2.常用事件介紹 事件觸發時機 onreadystatechange 當readystate的值...