广东IT优就业
Ajax(Asynchronous JavaScript and XML)不是一门独立的技能,它是由HTML、JavaScript、CSS和DOM等技能组成。
传统的Web运用许可用户填写表单,当提交表单时就向做事器发送一个要求,做事器吸收并处理用户提交过来的表单数据,并返回一个新的网页给用户,这样的做法会摧残浪费蹂躏许多带宽,由于每次的运用交互都要向做事器发送要求,运用的相应韶光依赖于做事器的相应韶光,导致了用户界面的相应韶光慢,给予用户不佳的体验。
Ajax很有用的地方就在于不刷新页面并且访问数据库处理数据(如在注册情景下,检测用户名是否已经存在,并返回结果的过程),并按照数据的处理结果按你想要的办法对界面做出即时的变动。总体上,利用Ajax具有如下上风,随着广州IT培训老师一起来看看:
1.减轻客户真个内存花费。
2.无刷新更新页面,给用户一种连续的体验。
3.将传统的做事器事情转嫁到客户端,从而减轻做事器和带宽的包袱,节约空间和带宽的租用本钱。
4.基于标准化技能。
利用 JavaScript 向做事器提出要求并处理相应而不壅塞用户!核心工具XMLHTTPRequest。通过这个工具,您的 JavaScript 可在不重载页面的情形与 Web 做事器交流数据,即在不须要刷新页面的情形下,就可以产生局部刷新的效果,理念为“按需取数据”。
一、JS版本的Ajax利用
在JS中利用XMLHTTPRequest工具时须要把稳不同浏览器之间对它的实现,在IE中把XMLHTTPRequest实现为ActiveX控件工具,二其他浏览器把它实现为一个本地的javascript工具。以是创建时为了兼容需在代码中添加判断逻辑创建相应的做事器所需的XMLHTTPRequest工具,下表是它的方法。
二、五步利用法:
1.创建XMLHTTPRequest工具
2.利用open方法设置和做事器的交互信息
3.设置发送的数据,开始和做事器端交互
4.注册事宜
5.更新界面
三、下面用一个小案例实现Ajax的数据交互
需求:在用户输入完用户名后返回用户名是否存在,显示在输入框旁
实现:
1.页面显示只须要一个输入框和span来显示用户名在数据库中的状态,以post办法进行ajax的数据交互
2.页面的js代码部分须要创建Ajax进行异步通信的核心工具XMLHTTPRequest工具、获取用户输入的用户名、将用户名以Ajax以GET/POST的办法发送给指定的URL(卖力逻辑判断的servlet部分)、对XMLHTTPRequest工具的进行监听readyState和status,如果readyState==4并且status==200那么表示做事器相应成功,依据做事器返回的数据对前端页面进行变动或者提示,我的这个案例便是在span中提示用户名的状态
3.后端servlet部分是卖力吸收前台发送过来的数据,利用C3P0数据源连接池和DBUtils对数据库进行连接和查询用户名,并返回JavaBean实体类,即时User类,如果不为null表示数据库中已经存在,不能利用,response.getWriter().write(\"大众0\"大众),往前端返回0,前端根据返回值进行span提示;反之可以利用,response.getWriter().write(\公众1\"大众)。
四、代码部分:
(1)index.jsp(页面显示部分):
(2)AcceptAjax(servlet逻辑判断部分):
(3)User(JavaBean实体类):
(4)大略数据库部分(MYSQL):
希望广州IT培训老师分享的内容对大家有所帮助。
广东IT优就业
出处:www.cnblogs.com/Alice-Thinker/p/8391498.html
更多IT精彩推举:
带你打开天下第一编程措辞的大门:http://www.ujiuye.com/zt/java/?