AJAX

1.什么是 AJAX ?
AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。
2.AJAX 工作原理

AJAX_第1张图片
AJAX

3.GET和POST
GET - 从指定的资源请求数据
POST - 向指定的资源提交要处理的数据
GET 基本上用于从服务器获得(取回)数据。注释:GET 方法可能返回缓存数据。
POST 也可用于从服务器获取数据。不过,POST 方法不会缓存数据,并且常用于连同请求一起发送数据。
4.异步 - True 或 False?
AJAX 指的是异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。
XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参数必须设置为 true:
共同点: 都是向服务器请求数据的方式
GET POST
数据放在地址栏后 ?reg=123&psw=123 send(数据参数)
数据量小 数据量大
安全性低 安全性高
传输速度快
5.HTTP协议
HTTP是一个属于应用层的面向对象的协议, 由于其简捷,快速的方式, 适用于分布式超媒体信息系统.
HTTP协议的主要特点有:
1, 支持客户端/服务端模式. 即请求(request)-响应(response)模式
2, 简单快速, 客户端向服务端发送请求时, 只需要传送请求方式和路径即可,所以简单, 由于HTTP协议简单, 使得HTTP服务器的程序规模小, 因而速度很快;
3, 灵活, 传输数据类型种类多
4, 无连接, 请求一次服务器后立刻断开连接, 即非长连接, 即短连接
5, 无状态, HTTP协议对事务处理没有记忆能力; session
HTTP协议的请求方式: GET, POST, HEAD, PUT等
HTTP包含: 请求头和请求体 响应头和响应体
HTTP 协议中, 状态码
404: 找不到服务器中的资源
403: 服务器缓存
500: 服务器故障
200: 【正常】返回
400: 语法错误导致服务器不识别
503: 由于服务器过载或维护导致无法完成请求
6.封装 ajax 请求的函数
参数:obj 是一个对象,其中包含如下属性
method 请求数据的方式: GET, POST
url 请求数据的地址
data 请求的数据, 对象的形式 {regname:123, psw:123}
async true:异步 否则就是同步
success 成功的回调函数
failture 失败的回调函数
7.ajax实例



    
        
        
    
    
        滚来滚去
        
    
    

8.ajax封装实例
第一步:先封装一个函数

// 封装1个函数,请求数据
/*
 * 参数:
 *      url         请求的地址与参数
 *      callback    回调函数
 */

function ajax(url, callback) {  
    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", url, true); 
    xhr.send(); 
    xhr.onreadystatechange = function() {   
        if (xhr.readyState == 4 && xhr.status == 200) {
            var str = xhr.responseText;     
            callback && callback(str);  
        }
    }
}

第二步:调用并输出结果

    
        

你可能感兴趣的:(AJAX)