• ajax第二天学习


    post方式发送请求

      要首先设置请求头(参数设置为ajax.setRequestHeader("content-type","application/x-www-form-urlencoded")

      -->send中放入要发送的参数(key=value&key=value)-->发送数据(ajax.send(context))

    当xml作为载体的时候servlet中声明发送的格式为xml

      response.setContextType("text/xml;charset=utf-8");

      

    <script type="text/javascript">

    //定位button按钮,同时添加单击事件

    document.getElementsByTagName("input")[0].onclick = function(){

    //NO1)创建AJAX异步对象(每个浏览器内置的,无需第三方jar包)

    var ajax = createAJAX();//0

    //NO2)AJAX异步对象准备发送请求

    var url = "${pageContext.request.contextPath}/TimeServletAjax?id="+new Date().getTime();

    var method = "GET";

    ajax.open(method,url);//1

    //NO3AJAX异步对象真正发送请求体的数据到服务器,如果请求体无数据的话,用null表示

    var content = null;

    ajax.send(content);//2

    //----------------------------------------等待

    //NO4AJAX异步对象不断监听服务端状态的变化,只有状态码变化了,方可触发函数

    //0-1-2-3-4,这些是可以触发函数的

    //4-4-4-4-4,这些是不可以触发函数的

    //以下这个函数是服务器来触发的,不是程序员触发的,这和onclick是不一样的

    ajax.onreadystatechange = function(){

    //如果AJAX状态码为4

    if(ajax.readyState == 4){

    //如果服务器响应码是200

    if(ajax.status == 200){

    //NO5)从AJAX异步对象中获取服务器响应的结果

    var str = ajax.responseText;

    //NO6)按照DOM规则,将结果动态添加到web页面指向的标签中

    document.getElementsByTagName("span")[0].innerHTML = str;

    }

    }

    }

    }

    </script>

    public class TimeServletAjax extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {

    SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");

    String str = sdf.format(new Date());

    //注意:在Web2.0时代,即异步方式下,不能用转发或重定向

    //因为:转发或重定向会引起浏览器全部刷新,而不是局部刷新

    //所以得用以输出流的方式将服务器的结果输出到浏览器

    response.setContentType("text/html;charset=UTF-8");

    PrintWriter pw = response.getWriter();

    pw.write(str);

    pw.flush();

    pw.close();

    }

    }

    XMLHttpRequest(即:AJAX)对象常用事件,方法和属性

       (1)事件:

            ajax.onreadystatechange:表示AJAX异步对象不断监听服务端的响应,

            是由服务器程序触发,不是程序员触发

       (2)属性:

        ajax.readyState==0:表示AJAX异步对象已创建好,但还没有调用open()方法

        ajax.readyState==1:表示AJAX异步对象已调用open()方法,但还没有调用send()方法

        ajax.readyState==2:表示AJAX异步对象已调用send()方法,但请求还没有到达服务器端

        ajax.readyState==3:表示服务端已接收到AJAX异步对象的请求,正在处理响应中。。。

    ajax.readyState==4】:表示AJAX异步对象已经完完全全接收到了服务器的响应信             息,但接收到的数据不一定都正确

    上述5种状态不是所有浏览器都相同,但状态4每种浏览器都相同

            ajax.status==200:表示AJAX异步对象接收到响应码,如果是200的话,表示一切正常

            ajax.responseText:表示从AJAX异步对象中获取HTML载体中的数据

        ajax.responseXML:表示从AJAX异步对象中获取XML载体中的数据

  • 相关阅读:
    第六章脑图
    20192419实验四 《Python程序设计》实验报告
    20192419 实验三《Python程序设计》实验报告
    20192419 实验二《Python程序设计》实验报告
    20192419 实验一《Python程序设计》实验报告
    小组讨论-第十章 密码学及应用
    2019-2020-1学期 20192419 《网络空间安全专业导论》第十二周学习总结 (读书笔记)
    2019-2020-1学期 20192419 《网络空间安全专业导论》第十二周学习总结 (读书心得)
    2019-2020-1学期 20192419 《网络空间安全专业导论》第十一周学习总结 (读书心得)
    2019-2020-1学期 20192419 《网络空间安全专业导论》第十一周学习总结 (读书笔记)
  • 原文地址:https://www.cnblogs.com/hello-liyb/p/7837673.html
Copyright © 2020-2023  润新知