ajax

1.1ajax介绍

asynchronous:异步

异步，同步相对立的一对概念；

javascript;

and

xml( extensionable markup language),可扩展标记语言

异步的javascript和xml技术；

 

1.2xml介绍

xml是介于html和xtml之间的产物，用来解决早起传输数据时的，格式的问题。

xml和html最根本的区别：xml标签可扩展，用户自己定义，html标签是固定的

xml是用来传输数据的 ，html是用来显示数据的；

1.3应用场景

1.注册用户时，用户输入完毕需要从数据库查询是否存在提示；

2.百度输入框输入，从服务器查询相似信息；

1.4ajax对象的床架

说明：js通过XMLHttpRqquest对象和服务器搭线，进行交互

该对象的创建都是通过：new  XMLHttpRqquest对象创建

//创建ajax对象，对象调用成员实现对服务器的请求
//    //① 创建对象
//    var xhr = new XMLHttpRequest();
//
//    //监听ajax状态
//    xhr.onreadystatechange = function(){
//        if(xhr.readyState==4){
//            //alert(xhr.responseText);
//            document.getElementsByTagName('input')[0].value = xhr.responseText
//            //document.body.innerHTML += xhr.responseText;
//        }
//    }
//
//    //② 创建一个新的http请求(打开浏览器，输入请求地址)
//    //xhr.open(请求方式get/post,请求地址[,异步同步请求]);
//    xhr.open("get",'./index.php?uid=123');
//
//    //③ 发送请求
//    //xhr.send(post请求数据 / get请求设置null);
//    xhr.send(null);
}

 ajax对象的成员
        属性：
            responseText 以字符串形式接收服务器端返回的信息
            readyState   表示ajax状态值
            onreadystatechange  事件，该事件可以感知ajax状态(readyState)的变化
                                ajax请求过程中要随时感知其状态
        方法：
            open()创建一个新的http请求
            send()发送请求到服务器

        ajax有5种状态readyState：
        0------> 创建ajax对象完毕
        1------> 有调用open()方法
        2------> 有调用send()方法
        3------> 服务器端数据只返回了一部分
        4------> 服务器端数据全部返回，ajax请求完成

        
        */
//        function f1(){
//            var xhr = new XMLHttpRequest();
//            
//            //设置事件onreadystatechange 感知ajax状态变化
//            xhr.onreadystatechange = function(){
//                if(xhr.readyState==4){
////                    alert(xhr.responseText);
//                    document.body.innerHTML += xhr.responseText;
//                }
//            }
//
//            xhr.open('get','./03.php');
//
//            xhr.send(null);
//        }