标签：复杂 html 处理 math 结果 false 交换 fast ref
在传统的Web应用中，每次请求服务器都会生成新的页面，用户在提交请求后，总是要等待服务器的相应。如果前一个请求没有得到相应，则后一个请求就不能发送。由于这是一种独占式的请求，因此如果服务器相应没有结束，用户就只能等待或者不断的刷
新页面。在等待期间，由于新的页面没有生成，整个浏览器将是一片空白，而用户只能继续等待。对于用户而言，这是一种不连续的体验。同时，频繁的刷新页面也会使服务器的负担加重。
Ajax(Asynchronous JavaScript and XML)技术就是为了弥补以上的不足而诞生的。Ajax是一种无刷新技术，由JavaScript、XML、CSS等技术整合而成。
Ajax的执行流程是，用户界面触发时间调用JavaScript，通过Ajax引擎——XMLHttpRequest对象异步发送请求到服务器，服务器返回XML、JSON或HTML等格式的数据，然后利用返回的数据使用DOM和CSS技术局部更新用户界面。
Ajax的的关键元素包括以下内容：
1.JavaScript语言：Ajax技术的主要开发语言。
2.XML/JSON/HTML等：用来封装请求或相应的数据格式。
3.DOM(文档对象模型)：通过DOM属性或方法修改页面元素，实现页面局部刷新。
4.CSS：改变样式，美化页面效果，提升用户体验度。
5.Ajax引擎：即XMLHttpRequest对象，以异步方式在客户端与服务器端之间传递数据。
XMLHttpRequest 用于在后台与服务器交换数据。所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用 ActiveXObject）。
创建 XMLHttpRequest 对象的语法：
XMLHttpRequest = new XMLHttpRequest();
老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：
XMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
为了应对所有的现代浏览器，包括 IE5 和 IE6，请检查浏览器是否支持 XMLHttpRequest 对象。如果支持，则创建 XMLHttpRequest 对象。如果不支持，则创建 ActiveXObject ：
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：
xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();
| 方法 | 描述 |
|---|---|
| open(method,url,async) |
规定请求的类型、URL 以及是否异步处理请求。
|
| send(string) |
将请求发送到服务器。
|
GET 请求：
xmlhttp.open("GET","demo_get.asp",true);
xmlhttp.send();
但get请求得到的可能是缓存的结果。
为了避免这种情况，需要向 URL 添加一个唯一的 ID：
xmlhttp.open("GET","demo_get.asp?t=" + Math.random(),true);
xmlhttp.send();
通过 GET 方法的URL发送信息：
xmlhttp.open("GET","demo_get2.asp?fname=Bill&lname=Gates",true);
xmlhttp.send();
POST 请求：
xmlhttp.open("POST","demo_post.asp",true);
xmlhttp.send();
如果需要像 HTML 表单那样 POST 数据，请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定发送的数据：
xmlhttp.open("POST","ajax_test.asp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");
其实使用post发送请求的话，servlet中可以用request.getParameter(name)获取值。
当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当 readyState 改变时，就会触发 onreadystatechange 事件。readyState 属性存有 XMLHttpRequest 的状态信息。下面是 XMLHttpRequest 对象的三个重要的属性：
| 属性 | 描述 |
|---|---|
| onreadystatechange | 存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。 |
| readyState |
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
|
| status |
200: "OK" 404: 未找到页面 |
请求成功后获取相应数据
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } }
| 函数 | 描述 |
|---|---|
| jQuery.ajax() | 执行异步 HTTP (Ajax) 请求。 |
| .ajaxComplete() | 当 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。 |
| .ajaxError() | 当 Ajax 请求完成且出现错误时注册要调用的处理程序。这是一个 Ajax 事件。 |
| .ajaxSend() | 在 Ajax 请求发送之前显示一条消息。 |
| jQuery.ajaxSetup() | 设置将来的 Ajax 请求的默认值。 |
| .ajaxStart() | 当首个 Ajax 请求完成开始时注册要调用的处理程序。这是一个 Ajax 事件。 |
| .ajaxStop() | 当所有 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。 |
| .ajaxSuccess() | 当 Ajax 请求成功完成时显示一条消息。 |
| jQuery.get() | 使用 HTTP GET 请求从服务器加载数据。 |
| jQuery.getJSON() | 使用 HTTP GET 请求从服务器加载 JSON 编码数据。 |
| jQuery.getScript() | 使用 HTTP GET 请求从服务器加载 JavaScript 文件，然后执行该文件。 |
| .load() | 从服务器加载数据，然后把返回到 HTML 放入匹配元素。 |
| jQuery.param() | 创建数组或对象的序列化表示，适合在 URL 查询字符串或 Ajax 请求中使用。 |
| jQuery.post() | 使用 HTTP POST 请求从服务器加载数据。 |
| .serialize() | 将表单内容序列化为字符串。 |
| .serializeArray() | 序列化表单元素，返回 JSON 数据结构数据。 |
使用Ajax请求之后，如果请求的数据是复杂数据类型的话，服务器需要将数据包装一下。
使用FastJSON可以很好的完成这个工作。
标签：复杂 html 处理 math 结果 false 交换 fast ref
原文地址：http://www.cnblogs.com/gaofei-1/p/7269865.html
