ajax课程-1

ajax教程-1

一、Ajax介绍：

Ajax是在网络浏览器（客户端）和服务器之间传送或接受数据的技术。Ajax结合了Java技术、XML以及JavaScript等编程技术，它实际上是几种技术，合在一起组成的一个功能强大的新技术。?Ajax可以通过异步的方式，向后端服务器发送请求、响应返回结果，对页面内容进行部分的更新，而不再需要每次由用户通过改变链接地址，对整个页面进行更新。

二、Ajax好处：

??? 传统的网络应用程序会将输入的信息提交给服务器（使用HTML表单），在服务器通过代码后，将会把一个全新的完整的页面传送给用户，由于用户每次提交输入信息的时候服务器都将传回一个新的页面，传统的网络应用程序通常运行缓慢且使用不便，使用AJAX，整个网页就可以于服务器之间局部的发送或者接收数据。

三、同步、异步：

同步：提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事。异步: 请求通过事件触发->服务器处理（这时候浏览器仍然可以作其他事情）->处理完毕。举个例子： 同步就是你叫我去吃饭，我听到了就和你去吃饭；如果没有听到，你就不停的叫，直到我告诉你听到了，才一起去吃饭。异步就是你叫我，然后自己去吃饭，我得到消息后可能立即走，也可能等到下班才去吃饭。打电话是同步 发消息是异步。

四、XMLHttpRequest对象：

?XMLHttp：是一套可以在javascript、vbscript、jscript等脚本语言中通过http协议传送或者接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。?XMLHttpRequest是XMLHttp组建的对象。Ajax的无刷新更新页面这一特点主要得益于XMLHttp组建的XMLHttpRequest对象，这样就可以像桌面应用程序一样只同服务器进行数据层面的交换，而不用每次都整个刷新界面，带来不必要的数据处理。

五、实例：

??? 1、传统方式客端与服务器传输数据:

?

??? myHtml.jsp

?
?? htmlServer.jsp?
??? 2、Ajax方式客端与服务器传输数据:
???
??? myAjax.jsp
?
?? ajaxServer.jsp
?
??? 3、传统ajax方式-用户登录实例:
?
??? login.jsp
??
?? loginAjax.jsp
?
?? loginOK.jsp
??
?? 4、jquery方式-用户注册实例（这里运用了jquery验证框架）:
?
??? register.jsp
?
?? registerOK.jsp
?
?? bottom.jsp
?五、jquery-ajax常用方法说明：
1、?jQuery.get( url, [data], [callback] )：使用GET方式来进行异步请求：
??? 参数： 
????url (String) :? 发送请求的URL地址. ?? ?data (Map) : (可选) 要发送给服务器的数据，以 Key/value 的键值对形式表示，会做为QueryString附加到请求URL中。 ??? callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。???? 返回的 data 可以是 xmlDoc, jsonObj, html, text, 等等。
?2、jQuery.post( url, [data], [callback], [type] ) ：使用POST方式来进行异步请求（同上）
 

 

查看更多 下一篇