哈哈,今天突然兴起,想了想自己对ajax的了解,来这里叙述下。心情好,嘿嘿嘿
ajax是一种创建交互式网页应用的网页开发技术。就是在不重新加载页面的情况下,更新部分网页。
ajax原理:ajax就是相当于在用户和服务器之间加了一个中间层,是用户操作与服务器操作相应异步化。并不是所有的用户请求都提交给服务器,像一些数据验证和数据处理等都交给了ajax引擎自己来做,只有确定需要从数据库读取数据的时候,再由ajax引擎代为向服务器提交请求。
ajax核心:通过XMLHttpRequest获取非本页内容。
ajax优势:
1、通过异步处理的模式提升用户体验
2、优化浏览器与服务器之间的传输,减少不必要数据的往返,减少带宽(单位时间内通过的数据量)占用
3、ajax引擎在客户端运行,承担一部分本来有服务器承担的任务,从而减少负载
ajax缺点:
1、不能实时请求和响应服务器数据
2、不支持浏览器回退功能
3、不能提交媒体数据,图片和文件
原生写的ajax五部曲,必不能忘记:
function ajax(){
// 1.创建异步对象
var ajaxObj = new XMLHttpRequest();
// 2.设置url 方法
ajaxObj.open(‘get‘,‘xxx.php‘);
// 3.发送请求
ajaxObj.send();
// 4.为状态改变事件 绑定 对应的代码
ajaxObj.onreadystatechange = function () {
if (ajaxObj.readyState == 4 && ajaxObj.status==200) {
// 5.在数据回来之后,修改界面的内容
// 创建元素,添加到界面上,或者 其他的操作
console.log(ajaxObj.responseText);
}
}
}
关于readyState共有五个状态(友好网址:http://www.educity.cn/wenda/64512.html):
0 - (未初始化)已经创建对象,还没有调用send方法
1 - (加载)准备开始发送数据
2 - (加载完成)已发送数据,正在等待响应返回
3 - (交互)正在接受响应,但是接受不完整
4 - (完成)接受响应完毕
(2、3、4都与响应挂钩,开始、过度、完成)
关于status :200,请求成功(友好网址:http://hibeary.iteye.com/blog/697997):
其他:
1xx - 信息提示
2xx - 成功
3xx - 重定向
4xx - 客户端错误
5xx - 服务器错误