AJAX = 异步 JavaScript 和 XML。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
1.用户填写表单字段并单击 Submit 按钮,整个表单发送到服务器
2.服务器将它转发给处理表单的脚本(通常是 PHP 或 Java)
3.脚本执行完成后再发送回全新的页面。
4.当然,在服务器上的脚本或程序处理和返回新表单时用户必须等待。屏幕变成一片空白,等到服务器返回数据后再重新绘制。这就是交互性差的原因,用户得不到立即反馈,因此感觉不同于桌面应用程序。
一个简单的ajax实现:
如上文图中的信息
xmlhttp.send(string); //发生请求,string可以不填
注意:
- 同步:指发出数据后,等接收到响应以后再发送下一个数据包的通讯方式。
- 异步:指发出数据后,不用等待接收到响应,接着发送下一个数据包的通讯方式。
注意:
如果需要像 HTML 表单那样 POST 数据,请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据:
POST 请求:
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); // 向请求添加HTTP头xmlhttp.send("fname=Bill&lname=Gates");
注意:
GET 还是 POST?
与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
然而,在以下情况中,请使用 POST 请求:
- 无法使用缓存文件(更新服务器上的文件或数据库)
- 向服务器发送大量数据(POST 没有数据量限制)
- 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
注意:每当 readyState 改变时,就会触发 onreadystatechange 事件。
在onreadystatechange 事件中,我们规定当服务器响应已做好被处理的准备时所执行的任务。
当readyState 等于 4 且 status 为 2字头或 304 时,表示响应已就绪。