實現原生ajax和本地存儲

手動實現一個ajax,不依賴第三方庫

let xhr = new XMLHttpRequest();
xhr.open('method', '/url', true);
xhr.onreadystatechange = function () {
  if (xhr.readyState === 4 && xhr.status === 200) {
    console.log(xhr.responseText)
  }
};
if (method === 'POST') {
  xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
}
xhr.send();

存儲

cookie , sessionStorage 和 localStorage的區別

cookie

  • 本身用于客戶端和服務器通信

  • 具有本地存儲的功能,于是被借用

  • 使用document.cookie = 獲取和修改

缺點:

  • 存儲量太小 ,只有4kb
  • 所有http請求都帶著 會影響資源獲取效率
  • api簡單,需要封裝才能使用

sessionStorage 和 localStorage

  • html5專為存儲設計最大容量5m
  • api簡單易用
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 三種本地存儲方式 cookie 前言 網絡早期最大的問題之一是如何管理狀態。簡而言之,服務器無法知道兩個請求是否來...
    流動碼文閱讀 5,010評論 0 3
  • 三種本地存儲方式 cookie 前言 網絡早期最大的問題之一是如何管理狀態。簡而言之,服務器無法知道兩個請求是否來...
    CodeMT閱讀 256評論 0 0
  • ??支持離線 Web 應用開發是 HTML5 的另一個重點。 ??所謂離線 Web 應用,就是在設備不能上網的情況...
    霜天曉閱讀 1,071評論 0 2
  • 樂人之樂者,人亦樂其樂 孔子說,學而時習之,不亦悅乎。這是自得其樂。有朋自遠方來,不亦悅乎。這是樂人。人不...
    覃榜言閱讀 1,967評論 1 5
  • 2017.6.9夜 夢到我和爸爸帶著爺爺去做手術,一個女醫生,一個小醫院,手術室很簡陋,開著門,可以看到正在做手術...
    奕蘅王閱讀 188評論 0 0