《JAVAAJAX教程第一章-初始AJAX.doc》由会员分享，可在线阅读，更多相关《JAVAAJAX教程第一章-初始AJAX.doc（16页珍藏版）》请在金锄头文库上搜索。
1、既然是认识AJAX，理论和实践相结合，这样让自己学的更快，理解更深入，我分一下几点：1、认识传统的同步交互方式和AJAX解决方案2、AJAX使用到的技术3、实例体验AJAX一、同步交互方式和AJAX解决方案传统的WEB应用是同步交互的方式，这种同步交互方式的处理过程如下图什么是同步交互方式：首先，用户向HTTP服务器提交一个处理请求。接着，服务器端接收到请求后，按照预先编写好的程序中的业务逻辑进行处理，比如和数据库服务器进行数据信息交换。最后，服务器对请求进行响应，将结果返回给客户端，返回一个HTML在浏览器中显示，通常会有CSS样式丰富页面的显示效果。同步交互的不足之处，会给用户一种不连贯的
2、体验，当服务器处理请求时，用户只能等待状态，页面中的显示内容只能是空白。AJAX解决方案AJAX采用的异步交互的处理方式，很好的解决不连贯的用户体验，处理过程如图：二、AJAX使用的技术1、JavaScript脚本2、XHTML和CSS3、DOM4、XML和XSTL5、XMLHTTPRequest三、实例体验AJAX首先，布置好开发环境：JDK 1.4以上，我使用1.6Eclipse 3.1以上，我使用3.4Tomcat 5.0以上，我使用6.0MySql 4以上，我使用5.0如果你没有十足的把握请搭建和我一样的环境。实例1：我先做一个传统同步交互的实例，然后同AJAX的异步交互进行对比。这里
3、还要介绍下J2EE中经常提到的MVC模式：MVC模式，即模型视图控制器模式，核心是代码分为相对独立的3个组成部分，其功能如下：模型（Model），业务逻辑层。实现业务逻辑、状态管理的功能。视图（View），表示层。即实现与用户交互的界面，通常实现数据的输入和输出功能。控制器（Control），控制层。起到控制整个业务流程的作用，实现View和Model部分的协同工作。在Model2中，采用Servlet作为控制器，负责接收客户端Web浏览器发送来的所有请求，并依据处理的不同结果，转发到对应的JSP页面实现在浏览器客户端的显示。Model2模式工作如下：好现在就开始写代码来实现上面的原理了：要有
4、三个东西，如下：一个页面，也就是View，先制定好是login.jsp，用来登陆的；一个Servlet，也就是Model，用来作为控制层。好了，奇怪为什么没有Control，也就是没有控制器呢？后面就知道咯！下面是Eclipse中的层次结果：login.jsp代码如下：%String result = (String)session.getAttribute(result);if(result !=null& result !=)if(result.equals(ok)out.println(window.alert(热烈的欢迎你！);elseout.println(winodw.alert(
5、对不起，登陆失败！);session.invalidate();%Insert title here用户名：密码：LoginAction.java代码如下：package classmate;import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import jav
6、ax.servlet.http.HttpSession;public class LoginAction_refersh extends HttpServlet Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp)throws ServletException, IOException / TODO Auto-generated method stubString uname = req.getParameter(uname);String pwd = req.getParameter(
7、pwd);String target = ;HttpSession session = req.getSession();if(uname.equals(yhw)&pwd.equals(admin)session.setAttribute(result, ok);target = /ajaxtest/login.jsp;elsesession.setAttribute(result, wrong);target = /ajaxtest/login.jsp;resp.sendRedirect(target);web.xml代码如下:ajaxtestloginclassmate.LoginActi
8、onlogin/loginlogin.jsp这样就完成了一个传统同步交互了哦。看看你的成果。实例2：做完了同步交互，现在要来正式体验AJAX异步体验了哦。注意的是，现在要使用MySql，而且也涉及到了采用AJAX后的MVC设计模式：MySql就不说了，你要做的准备就是安装好MySql数据库，和下一个驱动JAR包。采用AJAX后的MVC设计模式，如图：文件层次如下：先来看View，视图部分的代码，login.jsp:Insert title herevarXMLHttpReq=false;functioncreateXMLHttpRequest()if(window.XMLHttpRequest)XMLHttpReq =newXMLHttpRequest();elseif(window.ActiveXObject)tryXMLHttpReq =newActiveXObject(MSXML2.XMLHTTP);catch(e)tryXMLHttpReq =newActiveXObject(Mircsoft.XMLHTTP);catch(e1)functionsendRequest(url)createXMLHttpRequest();XMLHttpReq.open(GE
