目录

前言

1、原生js实现

2、原生js实现——Promise版本

3、jQuery实现

4、Vue.js实现

总结

前言

下面对于各个版本的Ajax代码&＃xff0c;想要实际测试它们&＃xff0c;可以把它命名为server2.html&＃xff0c;然后放在当前目录views目录下面。具体的教程可以看测试Ajax的Nodejs服务端代码

1、原生js实现





点击我发送get请求

点击我发送post请求





2、原生js实现——Promise版本





点击我发送get请求

点击我发送post请求





3、jQuery实现







点击我发送get请求

点击我发送post请求






4、Vue.js实现







点击我发送get请求

点击我发送post请求






总结

• 使用原生js写ajax步骤比较麻烦&＃xff0c;考虑的东西比较多&＃xff0c;但是最接近底层&＃xff0c;对于理解ajax很有帮助&＃xff1b;
• Promise是同步的&＃xff0c;但是.then.catch是异步的&＃xff0c;具体可以查看验证Promise是同步的&＃xff1b;
• jQuery实现的写法比较简洁&＃xff1b;
• Vue.js的写法和Promise写法很像&＃xff0c;其实内部就是通过Promise来实现的&＃xff1b;
• 其实根据Promise可以将上面4种方法分为两类&＃xff1a;
  • 使用Promise&＃xff1a;方法2、4
  • 不使用Promise&＃xff1a;方法1、3
• 关于这四个方法Ajax&＃xff0c;我专门截取了一些主要的代码片断&＃xff0c;进行了更加精确的对比&＃xff0c;请查看原生js、jQuery和Vue.js的Ajax的详细对比