ajax小总结

Posted 2021-04-15 移动文化演讲团

ajax的定义：

中文意思：异步javascript和XML。

指一种创建交互式网页应用的网页开发技术。

ajax的核心是XMLHttpRequest，在页面中由XMLHTTPRequest来发出Http请求和获得服务器的返回数据。

 

ajax优点：

传统的web请求是同步的方式，当表单提交后，把原先大量的html返回给客户端，增加了带宽。

而使用异步的方式可以取得客户端真正需要的数据，减少了网络带宽。并且可以真正不用刷新页面就可以取得服务器返回的数据。

 

ajax请求步骤：

•、先来创建XMLHttpRequest对象

–在IE、Firefox、safari和Opera中创建该对象的JavaScript代码为：

var xhr = new XMLHttpRequest();

–在IE5/6中代码为：

var xmlRequest = newActiveXObject(“Microsoft.XMLHTTP”);

•二、为XMLHttpRequest对象设置请求参数

 1.设置参数：
     xhr.open("GET","GetAreasByAjax.ashx?isAjax=1", true);

2.POST方式：
xhr.open("POST", "GetAreasByAjax.aspx", true);

在xhr.send之前添加设置回调函数代码：

xhr.onreadystatechange = watching;

xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

3.设置浏览器不使用缓存
xhr.setRequestHeader("If-Modified-Since", "0");

•三、发送请求：(分别对应GET和POST)

   xhr.send(null);//GET方式

   xhr.send("isAjax=1&na=123");//POST方式

 

function watching() {

      if (xhr.readyState >= 4) {

          if (xhr.status == 200) {

              var msg = xhr.responseText; //服务器返回的字符串

          } else alert("服务器错误!" + ajaxH.status);

      }

}

 

readyState属性指出了XMLHttpRequest对象在发送/接收数据过程中所处的几个状态。XMLHttpRequest对象会经历5种不同的状态。

–0：未初始化。对象已经创建，但还未初始化，即还没调用open方法；

–1：已打开。对象已经创建并初始化，但还未调用send方法；

–2：已发送。已经调用send 方法，但该对象正在等待状态码和头的返回；

–3：正在接收。已经接收了部分数据，但还不能使用该对象的属性和方法，因为状态和响应头不完整；

–4：已加载。所有数据接收完毕

 

JSON定义：

•AJAX传递复杂数据如果自己进行格式定义的话会经历组装、解析的过程，因此AJAX中有一个事实上的数据传输标准JSon。Json（是一个标准，就像XML一样，Json规定了对象以什么样的格式保存为一个字符串）将复杂对象序列化为一个字符串，在浏览器端再将字符串反序列化为JavaScript可以读取的对象。看一下Json的格式。Json被几乎所有语言支持。

•C#中将.Net对象序列化为Json字符串的方法：JavaScriptSerializer().Serialize(p)，JavaScriptSerializer在System.Web.Extensions.dll中，是.Net3.x 中新增的类，如果在.Net2.0中则需要用第三方的组件。

•JQuery AJAX得到的data是Json格式数据，用$.parseJSON(data)方法将JSon格式数据解析为JavaScript对象

•可以在post函数最后一个函数传递"json"则data就是反序列化以后的对象，免去了parseJSON。