ajax基础

ajax 基本概念 ajax 是Asynchronous JavaScript + XML 的简写。指一种创建交互式网页开发的技术。 通过异步模式,提升了用户体验。优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用。 ajax 引擎在客户端运行,承担了一部分本来有服务器承担的工作,从而减少了大量用户下的服务器负载。 ajax 最大的特点就是局部刷新。 ajax 技术核心是 XMLHttpRequest 对象(简称 XHR ) 创建 ajax 对象 new XMLHttpRequest(); ajax 的操作 创建 ajax 实例 var ajax = new XMLHttpRequest(); 明确后台的接口地址和请求方法:接口地址以data.php为例;请求方式以get为例 ajax.open('GET','data.php',true); // 第三个参数为是否为异步操作,默认为true 发送 ajax 请求 ajax.send(); 服务器接收到请求,处理数据,响应数据 浏览器接收到服务器响应的数据,开始解析处理数据 浏览器的数据接收 ajax.responseText onreadyState 状态码 只有当服务器处理完信息,并且返回数据的时候,浏览器才能得到数据并解析数据。但是,这就存在了一个问题:服务器在处理 ajax 请求的时候,浏览器就已经解析过了 ajax 数据,此时得到的数据为空。这就需要我们在使用 ajax 数据的时候首先要判断服务器端处理数据并且返回数据。这就需要用到 onreadState 状态码以及 onreadstatechange监听事件。 onreadState 有五种状态码,分别对应数字0,1,2,3,4 0 请求未初始化 1 服务器建立已连接 2 请求已接收 3 处理请求,响应中 4 响应就绪 很明显,当状态码为 4 的时候,就证明服务器处理完成并且返回数据,这时候就可以使用数据了 事件监听 通过 onreadstatechange 事件监听来判断服务器执行到哪一步了 ajax.onreadstatechange = function(){ if(ajax.readState == 4){ var data = ajax.responseText; alert(data); console.log(data); } } ajax 另外一个属性-status, 表示HTTP状态码 常见的状态码 200 请求成功; 301 Moved Permanently 资源被永久转移到其他URL 304 Not Modified 使用缓存文档 404 请求资源不存在 500 内部服务器错误 状态码分类 1.. 信息 服务器收到请求,需要请求者继续执行操作 2.. 成功 操作被成功接收并处理 3.. 重定向 需要进一步的操作以完成请求 4.. 客户端错误 请求包含语法错误或者无法完成请求 5.. 服务器错误 服务器在处理请求的过程中发生了错误