技术根底：

HTML+CSS：略懂JS：纯熟※

开发工具：

IDEA

测试：

伪造Ajax,应用iframe 测试，感触成果

a)新建模块，导入web反对b)编写一个html文件，应用iframe测试，浏览器运行![image.png](/img/bVbMqm7)![image.png](/img/bVbMqnQ)

开发

基础知识：

  1. 应用ajax技术的网页，通过在后盾服务器进行大量的数据交换，就能够实现异步部分更新。
  2. 应用Ajax，用户能够创立靠近本地桌面利用的间接、高可用、更丰盛、更动静的Web用户界面。

Ajax的外围是XMLHttpRequest对象(XHR)。XHR为向服务器发送申请和解析服务器响应提供了接口。可能以异步形式从服务器获取新数据。

3.jQuery 提供多个与 AJAX 无关的办法。

4.通过 jQuery AJAX 办法，可能应用 HTTP Get 和 HTTP Post 从近程服务器上申请文本、HTML、XML 或 JSON – 同时可能把这些内部数据间接载入网页的被选元素中。

5.jquery.ajax 应用到的局部参数：

url：申请地址
type：申请形式，GET、POST
data：要发送的数据（重要！！！！）
success：胜利之后执行的回调函数(全局)error：失败之后执行的回调函数(全局)

测试利用场景：

注册时，输出用户名自动检测用户是否曾经存在。

登陆时，提醒用户名明码谬误

删除数据行时，将行ID发送到后盾，后盾在数据库中删 除，数据库删除胜利后，在页面DOM中将数据行也删除。

1、应用最原始的HttpServletResponse解决
（1）配置web.xml和springmvc的配置文件

（2）编写一个AjaxController

（3）index.jsp中导入jquery ， 能够应用在线的CDN ， 也能够下载导入（cdn我没有拜访到，间接百度下载包放入web>static>js目录下）

（4）编写index.jsp测试

（5）启动tomcat测试！关上浏览器的控制台，当咱们鼠标来到输入框的时候，能够看到收回了一个ajax的申请！是后盾返回给咱们的后果！测试胜利！

**参数不匹配时：**![image.png](/img/bVbMqBq)**参数匹配时：**![image.png](/img/bVbMqBP)

Tip：业务流程：

Controller承受前端发送的username参数 与data外面的值相匹配过程中呈现的谬误：（1）短少lib包    起因：构建Maven我的项目时打包形式没选war    解决办法：右上角我的项目构建，新建一个lib文件夹，手动导入lib包。（2）运行到浏览器时，报错jQuery找不到     起因：    ①：一开始我是应用的在线CDN间接导的jQuery，网站进不去所以没拜访到，前面间接手动下载包导入的。    ②：手动导入后还是报错，查看代码后发现applicationContest中动态资源过滤器没有配置。    解决办法：在文件中配置    
<mvc:default-servlet-handler />  <mvc:annotation-driven />