zoukankan      html  css  js  c++  java
  • ajax异步传输

    2015.12.7 ajax异步传输

     

    1、ajax :不是一个新的技术。

    js(XMLHTTPRequest) html css dom xml

    这里只是一个新的js的内置对象。这算是js想要变得流行的第二招,第一招是从起名叫做javascript,第二步就是异步传输,获得更棒的用户体验。对于异步传输的起名:依然采用了一个能让自己变火的名字:ajax x就是借助了当时最火的数据传递方式:xml。所以对于异步传输来说可以采用xml作为数据的传递方式也可以采用json作为数据的传递格式。

    Ajax的全名叫做:Asynchronous JavaScript And XML

    2、作用:在不中断用户操作的前提下,完成用户的提交从而提高用户体验。同时因为是局部刷新所以提高了页面的响应速度,节省了流量,提供了更加高效的网络资源的应用环境。

    3、Ajax的使用方式:

    1)创建异步请求对象

    2)根据一步请求的对象,打开和服务器之间的链接

    3)设置(注册)一个回调函数(用来接收服务器做出的响应)

    4)发送请求【因为此时才发送请求,所以23顺序可以交换】

    5)得到回调后,处理响应回来的数据。

    4、在get请求的方式下,传递数据仅有2种方式。

    1)通过地址栏的问号参数进行传值,

    2)通过请求头信息进行传值

    3)注:get请求方式下,send方法不可用。

    5、在post的请求的方式下,传递数据有3种方式:

    1)地址栏的问号参数方式

    2)请求头的方式

    3)以send方式进行传递,不过:

    需要在请求头中:进行这样的设置:【content-typeapplication/x-www-form-urlencoded】此时服务器会议表单形式接收请求的数据。

    6、异步传输的数据,也是以字符串的形式,但是在字符串中又有一定的格式,key=value

    7、利用xml传输的格式还是字符串,但是字符串中写的也是xml标签,标签中才是数据

    8、还有一个二级联动的例子,通过选择省得到对应的市的下拉菜单中的内容。这个自己也要敲一遍。然后试着利用递归做一个可以访问更多层级的案例。不过一般也就2-3级。总写就会有想法的。

     

     

    作业:1、课堂例子

     2、购物车、修改购买数量、改成异步的

     3json

     

    Ajax说到底是前端的javascript技术,并不涉及到后端的什么,不用想那么神秘。

     

     

     

    回调函数的相应设置:当状态是4的时候才有必要进行处理,当其他时段都还不必要。

     

    快哭出来了~,为什么根本不出结果呢!!!

     

    Ajax应用举例:

    1)Div浮层式的登录窗口

    2)停留在右下角的广告层

    3)变换图片div(幻灯新闻)

    4)选项卡

    5)菜单栏

    6)框架的应用

     

    AJAX技术的作用

    1)更自然、更流畅的用户体验,对用户的操作即时响应

    2)在不中断用户操作的情况下与web服务器进行通信

    3)更林敏的响应用户访问,实现近似于桌面应用程序的交互效果

    4)通过局部更新页面,降低网络流量,提高网络的使用效率

     

    AJAX(Asynchronous JavaScript And XML)

    1)HTML用于建立web表单并确定应用程序其他部分使用的字段

    2)javaScript代码试运行AJAX应用程序的核心代码,帮助改进与服务器应用程序的通信。

    3)DHTMLDynamicHTML,用于动态更新表单

    4)文档对象模型DOM用于处理HTML结构和服务器返回的XML

     

     

    老师你骗人!!!这个 出不来结果!!!

     

    利用刚刚那种方式取得到的结果是null。并不知道 怎么可以弄出来。但是可以通过参数获得。这个时候通过参数是可以获得值的。

    所以结果不能再用head获得,因为head里面就只有:

    accept

    accept-language

    referer

    content-type

    ua-cpu

    accept-encoding

    user-agent

    host

    content-length

    connection

    cache-control

    Cookie

    这几个属性,但是设置过Content-type之后,就可以允许在send里面以表单的形式,将数据发送出来。详情看postwithsendTestServlet5里面的设置。自己做的时候出现的一些问题:

    问题就是不知道哪里出了问题。

    哦哦哦!想起来了,刚刚利用

    问题在这里,现在使用javaEE6web3.0就跑了,但是刚刚使用JavaEE7-web3.1就是不出结果,可以再试试这里。再用6跑一次 7跑一次。而且!!!利用7的环境创建servlet时候,在web.xml

    里面descriptiondisplay-nameservlet-name三者的关系是错位的。所以7是不稳定的。小超利用8.6的结果是一样的。我再试试这些问题。这次用7也跑出来了。。。笑哭。不知道问题在哪里,看来果然除了bug还是重写为王道。但是这个异步的东西不知道放在了哪里。就是不太会更新,所以,如果一旦出了问题,还是要重启。重新部署是不好使了。嗯!对于这个bug重启myeclipse是好使的。但是好像底下也就是控制台貌似不太输出啊。看来得需要一个什么方式把它先印出来,才行。上次关于 那个 内置对象也有bug。监听器,那个部分的。真的是不重启都不刷新。这个的演示就不要再用内置的浏览器了,要改用外面的浏览器。

    编码是个问题【待解决】

    除了 过去时候的编码问题全部解决,主要指异步传输这个地方。

     

     

  • 相关阅读:
    js类型转换 枫
    AspNetPager操作示例1 枫
    discuz资料 枫
    Request.params的知识 枫
    C#实现自动锁屏+关屏 枫
    iis访问aspx文件显示404无法找到文件? 枫
    filter:alpha(opacity=100,style=1) 枫
    IIS安装程序无法复制文件的问题(转载) 枫
    DataTable 枫
    windows系统函数详解(控制面板等常用函数) 枫
  • 原文地址:https://www.cnblogs.com/letben/p/5185314.html
Copyright © 2011-2022 走看看