Ajax

Ajax

• XMLHttpRequestr文档
• jq ajax 文档 ====== 参考2
• Zepto ajax 文档
• Fetch 文档
• Axios 文档
• wx.request 微信程序 文档
• uniApp 用uni.request 文档

什么是 AJAX ？

AJAX = 异步 JavaScript 和 XML。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。

有很多使用 AJAX 的应用程序案例：新浪微博、Google 地图、开心网等等。

AJAX 工作原理

AJAX是基于现有的Internet标准

AJAX是基于现有的Internet标准，并且联合使用它们：

XMLHttpRequest 对象 (异步的与服务器交换数据)
JavaScript/DOM (信息显示/交互)
CSS (给数据定义样式)
XML (作为转换数据的格式)
AJAX应用程序与浏览器和平台无关的！

经典表达式

  var xhr = new XMLHttpRequest()
        xhr.onreadystatechange = function(){
          if(xmlhttp.readyState==4 && xmlhttp.status==200){
            console.log(xhr.responseText)
          }
        }
        xhr.open('POST','http://localhost:8080/add')

实现一个Ajax?

AJAX创建异步对象XMLHttpRequest
操作XMLHttpRequest 对象

（1）设置请求参数（请求方式，请求页面的相对路径，是否异步）

（2）设置回调函数，一个处理服务器响应的函数，使用 onreadystatechange ，类似函数指针

（3）获取异步对象的readyState 属性：该属性存有服务器响应的状态信息。每当 readyState
改变时，onreadystatechange 函数就会被执行。

（4）判断响应报文的状态，若为200说明服务器正常运行并返回响应数据。

（5）读取响应数据，可以通过 responseText 属性来取回由服务器返回的数据。

原生js 请求

 var xhr = new XMLHttpRequest();
			xhr.open("GET","http://180.76.189.68:8911/singleProject/cj/list",true);
            xhr.setRequestHeader('Content-Type', 'application/json');
			xhr.onload = function(){
				if (this.status == 200) {
					console.log(this.responseText);
				}
			}
            xhr.send();

ajax问题讲解