实现原生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,029评论 0 3
  • 三种本地存储方式 cookie 前言 网络早期最大的问题之一是如何管理状态。简而言之,服务器无法知道两个请求是否来...
    CodeMT阅读 264评论 0 0
  •   支持离线 Web 应用开发是 HTML5 的另一个重点。   所谓离线 Web 应用,就是在设备不能上网的情况...
    霜天晓阅读 1,092评论 0 2
  • 乐人之乐者,人亦乐其乐 孔子说,学而时习之,不亦悦乎。这是自得其乐。有朋自远方来,不亦悦乎。这是乐人。人不...
    覃榜言阅读 1,977评论 1 5
  • 2017.6.9夜 梦到我和爸爸带着爷爷去做手术,一个女医生,一个小医院,手术室很简陋,开着门,可以看到正在做手术...
    奕蘅王阅读 188评论 0 0