编写Ajax

    技术2022-07-10  132

    变量和属性

    用没有定义的变量——报错用没有定义的属性——undefined alert(window.a);

    编写Ajax

    创建Ajax对象 XMLHttpRequest()

    连接服务器 open(方法, 文件名, 异步传输) 同步和异步 同步:事情一件一件来 异步:多个事件一起做

    发送请求 send()

    请求状态监控

    onreadystatechange事件

    readyState属性:请求状态 0 (未初始化)还没有调用open()方法 1 (载入)已调用send()方法,正在发送请求 2 (载入完成)send()方法完成,已收到全部响应内容 3 (解析)正在解析响应内容 4 (完成)响应内容解析完成,可以在客户端调用了

    status属性:请求结果

    responseText

    function ajax(url, fnSucc, fnFaild) { //1.创建Ajax对象 var oAjax=new XMLHttpRequest(); //2.连接服务器 //open(方法, 文件名, 异步传输) oAjax.open('GET', url, true); //3.发送请求 oAjax.send(); //4.接收返回 oAjax.onreadystatechange=function () { //oAjax.readyState //浏览器和服务器,进行到哪一步了 if(oAjax.readyState==4) //读取完成 { if(oAjax.status==200) //成功 { fnSucc(oAjax.responseText); } else { if(fnFaild) { fnFaild(oAjax.status); } //alert('失败:'+oAjax.status); } } }; }

    使用:

    <script src="new_ajax.js"></script> <script> window.onload=function () { var oBtn=document.getElementById('btn1'); oBtn.onclick=function () { ajax('a.txt', function (str){ alert(str); }); }; }; </script> </head> <body> <input id="btn1" type="button" value="读取" /> </body>
    Processed: 0.010, SQL: 9