Ajax笔记

1、 Ajax定义及其工作原理

Ajax 由 HTML、JavaScript 技术、DHTML 和 DOM 组成，这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。

 

2、 创建XMLHttpRequest对象

对于Ajax，最核心的一个对象是XMLHttpRequest，所有的Ajax操作都离不开对这个对象的操作

    xmlHttp = new XMLHttpRequest();    xmlHttp =new ActiveXObject(‘Microsoft.XMLHTTP’);

 

3、 XMLHttpRequest对象相关方法

    XMLHttpRequest.open(传递方式,地址,是否异步请求)//打开请求

    XMLHttpRequest.onreadystatechange//准备就绪执行    XMLHttpRequest.responseText//获取执行结果

4、一个简单的例子

index.php文件中

    
    
         
     
       show lgx     
      
        show zbj     
       
      
     
    

 

ajax.js 文件中

     var xmlHttp;    function $_xmlHttp(){        if(window.XMLHttpRequest){            xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');        }else if(window.ActiveXObject){            xmlHttp = new XMLHttpRequest();        }    }    function funAjax(id){        $_xmlHttp();        xmlHttp.open("get","chuli.php?id="+id,true);        xmlHttp.onreadystatechange = change;        xmlHttp.send(null);    }    function change(){        var changeResult = xmlHttp.responseText;        document.getElementById('show').innerHTML = changeResult;    }

chuli.php文件中

5、 比较标准的ajax框架

    var http_request = false;    function createRequest(url) {    //初始化对象并发出XMLHttpRequest请求        http_request = false;        if (window.XMLHttpRequest) { //Mozilla等其他浏览器            http_request = new XMLHttpRequest();        if (http_request.overrideMimeType) {            http_request.overrideMimeType("text/xml");         }        } else if (window.ActiveXObject) { //IE浏览器        try {            http_request = new ActiveXObject("Msxml2.XMLHTTP");        } catch (e) {        try {            http_request = new ActiveXObject("Microsoft.XMLHTTP");        } catch (e) {            }           }        }        if (!http_request) {            alert("不能创建XMLHTTP实例!");            return false;        }        http_request.onreadystatechange = alertContents; //指定响应方法        http_request.open("GET", url, true); //发出HTTP请求        http_request.send(null);        }        function alertContents() { //处理服务器返回的信息        if (http_request.readyState == 4) {        if (http_request.status == 200) {            alert(http_request.responseText);        } else {            alert('您请求的页面发现错误');                }            }        }