01-AJAX 技术入门,用IntelliJ部署Web项目
ajax教程
ajax教程AJAX教程AJAX（Asynchronous JavaScript and XML）是一种用于创建交互式网页应用程序的技术。
它通过在后台与服务器进行数据交换，而不需要重新加载整个页面，实现了在网页上更新部分内容的功能。
AJAX的核心是JavaScript和XML（现在也可以使用JSON）的组合。
它借助XMLHttpRequest对象来与服务器进行数据交换，将返回的数据动态显示在网页上。
AJAX的优势在于提升用户体验和减少网络流量。
通过使用AJAX，我们可以在不刷新整个页面的情况下获取数据并将其显示在页面上，这样能够实现更加快速、流畅的用户交互。
同时，由于只获取了需要的数据，而不是整个页面，所以也减少了不必要的网络流量，达到了节省带宽的效果。
在使用AJAX的过程中，需要注意一些问题。
首先，需要处理不同浏览器的兼容性问题，因为不同浏览器对于AJAX的实现方式有所区别。
为了解决这个问题，我们可以使用现代的JavaScript库，如jQuery，它提供了封装好的AJAX函数，使开发过程变得简单易用。
其次，由于AJAX是通过与服务器进行异步通信来获取数据的，所以需要处理服务器响应的时间和错误。
为了保证用户体验，我们可以使用loading动画或进度条来提示用户正在等待数据加载。
最后，AJAX的设计应该符合优雅降级和渐进增强的原则。
优雅降级是指当某个功能在用户的浏览器中不可用时，可以有一个替代方案，而不是完全让功能无法使用。
渐进增强是指从最基础的功能开始，逐步增加更高级的功能，以确保在各种环境下都能正常工作。
总结来说，AJAX是一种强大的技术，可以帮助我们创建出更加交互式和高效的网页应用程序。
正确认识和使用AJAX，可以提升用户体验，并减少网络流量消耗。
但在应用中需要注意兼容性、响应时间和错误处理，同时还要遵循优雅降级和渐进增强的原则。
以上是关于AJAX的简要介绍，希望对你有所帮助。
如何使用Ajax技术开发Web应用程序(一)
ｆ １ｃ ０ Ｒ ａ ｒ ｅ Ｕ３ ｔ ｎ ａｊ ｘ ｅ ｄ（ ｊ ）ｆ ｉ ａ ｉ Ｉ
ｖ ｒ ｘ１ ｂ ｎ ａ １ｌ ｊ １Ｏ ｌ ｕｌ ｌ；
ｉ ｗ ｎ ｏ ． Ｍ Ｈ ｔ Ｒ ｑｌ ｔ ｛ ｆ（ ｉ ｄ ｗ Ｘ Ｌ ｔ ： ｅ ｔ ｓ ） 】 Ｐ ｅ
让 你 能 够 看 到ａ ａ 是如 何 工作 的 ，下 面 的脚 本 要 放到 ｊｘ
你 Ｊｈ ａ 标 箍 ’ 内 ｄ ｅ Ｈ：
＜ ｒｌ ｔ Ｐｅ ｔ ｘｔ ｊ ｖ ｃ ＞ ｓ ｃ ｐｔ Ｙ ｅ ． ８ ８ｓ ｐｔ ＜ ／ ｒｉ
＜ ｏ ｔ ｄ ｔ ＞这 是 一 示 例 数 据 ，它 被 保 存 在 一 ｒ ｏ ＞＜ ａ ａ 个 ｘ Ｌ 件 中 ， 并 被 Ｊ ｖ Ｓ ｒ ｔ 同 。 ＜ ｄ ｔ ＞ Ｍ文 ａａｅ ｉ 取 ｐ ／ ａ ａ
Ｊ ｖ ｃ ｐ 的 用 户 ， 丽 坡 “ ｘ｛１ 『 恃 被 运 ． 。 ａ ｒｉ ｔ ａ ｓ ａ 【１＿ ｌ＿“
ｗ ｂ 用 程序提 ｌ＿ 一 新 的 层次 ｅ应 丁到 个 ｝ 这 第 ＿ 步 就 是 需 要 创 建 … 个 带 一 螋 数 据 的Ｘ Ｌ Ｍ 文
件
这 个 链 接 被 隐 藏 ， 并 不 会 破 转 ｊ 圳
继 续 ， 我 将 讨 沧 更 多 的 方 法 ， 使 用 ａ ｘ 术 将 你 的 ｊ 技 ａ
开 一
注 意 ， 对 于 那 有ｊ ｖ ｃ ｐ 的 用 户 ， 我 们 ：没 ａ ａ ｒ ｔ ｓ ｉ
直 接 链 接 Ｎ ａ ａ ｘ ｌ 件 时 ｒ 琊 嗤 允 许 运 行 ｄ ｔ ．ｍ 文
亲 切 的 称 为 “Ａ ａ 应 用 程 序 ” （ ｎ ｒ ｎ ｕ ｘ Ｌ ｊ Ａ ｙ ｈ ｏ ｏ ｓ ｃ ｓ
AJAX新手快速入门
一 AJAX 我也行
1.0 缘起
我是一个勤奋的 Blogger，坚持不懈的写 Blog，让我有了很多的收获。比如 天南地北的朋友，比如千奇百怪的朋友，比如志同道合的朋友。 不时会有朋友加 我的 MSN，也不时会有一些有趣的对话、甚至诡异的对话。 但是，最为诡异的对话，是发生在 2005 年 11 月的某一天。一个叫 Yeka 的 朋友在 MSN 上跟我 hi 了一下。 Yeka：hi，你好，我是博文视点的。 我：你好，什么事呀 Yeka：想请你写一本书，看看你有没有兴趣。 我： Yeka：有朋友向我们推荐你的，我们也觉得你的文笔不错。 我：是什么书呀？（内心颇有些得意啊 Yeka：一本关于 AJAX 的新手入门的书。 我： （ 我的 朋友 ， 难 道这个 推荐 我的 朋友 ，不知道我不 懂 AJAX ）
的吗？八成是要害我吧！） 我：是谁呀。 Yeka：熊节，还有孟岩。 我：……（无语中……照理说，他们应该了解我的呀，怎么会推荐我来写 书呢？而且还是 AJAX 的书。）
可悲啊，我其实是一个意志不坚定的同志，经不起 Yeka、孟岩他们几个的 撺掇，我也就跃跃欲试了。内心里想着，AJAX 嘛，新出来的技术，能有多难，
对于 AJAX 本质的理解； 对于整个 AJAX 以及相关技术地图的理解； 对于 AJAX 编程开发所需要的很多技巧、手段的掌握； 几乎是不可能的。 如果没有（ N 多需要感谢的人）的（ N 多方面的帮助），我们这本书，也 不可能以现在这样的深度，以（N 个月）内完成的速度，送到读者的面前。
希望这本书，能够对大家快速学习 AJAX，有所帮助。
写一本新手入门嘛，也不用写得太深的。 现在拿在你手里的这本书，就是我的处女作了——应该叫我们，就像你在 封面上看到的那样，有三个人，这个故事有点复杂——这是一本关于 AJAX 的 书，也是一本关于我如何写出 《AJAX——新手快车道》 这样一本书的书。 对于我 来说，这既是一次极限的写作经历，也是一次极限的学习经历。 其中的刺激，让我们一起来领略吧，Let’s GO！
Ajax技术在Web应用系统开发中的应用
＿
器 进 行 异 步 数 据 处 理 ；使 用 Ｊｖ Ｓｒ ｔ 各 种 技 术 ａａ ｃｉ 将 ｐ
绑定 在一起 。
三 、 ｊｘ的 工 作 原 理 Ａａ
任 鲁 啊 毫
拳 ■ …一谱 拇 一 办门～ －谵 …
鬻鲁 一 ｝ 辊童 建掉一
ｌ
－ 嘲； 戢 ＾ 一 ｌ 办 讲 ｊ 琏
户 端 ，或 者 是 选 择 承 办 部 门 后 需 要 进 行 一 次 提 交 ， 而提交 将会重 新刷 新整 个 页面 ， 一种 办法 客户端 前
采 用 Ｂ Ｓ 系结 构 的 Ｗ ｅ ／ 体 ｂ应 用 系 统 ， 其 主要
工 作 原 理 是 基 于 ＨＴ Ｐ协 议 的 请 求 响 应 机 制 ，由 于 ｒ ＨＴ Ｐ协 议 的特 点 所 限 ，传 统 的 Ｗｅ Ｔ ｂ应 用 程 序 以 同
维普资讯
圆 ０ｌ１ 第期 ２ 用０ ０ ２ 日ｌ ６ 月 术２ 应 技 年
Ａａ 技术在Ｗ ｂ ｊ ｘ ｅ 应用系 统开发中的应用
◆ 内蒙古自治区赤峰市国家税务局 张学东
一
、
前 言
互 。Ａｊｘ引 擎 允 许 用 户 与 应 用 软 件 之 间 的交 互 过 程 ａ 异 步 进 行 ， 立 于 用 户 与 网络 服 务 器 之 问 的交 流 ， 独 这
步 交 互 方 式 工 作 ，客 户 发 出请 求 后 ，在 负 载 重 时 需 要等 待很长 时间 ； 提 交后 需要重 载整个 页 面 ， 在 这
样 既 降 低 了 系 统 性 能 ， 不 够 人 性 化 ， 用 Ａａ 又 采 ｊｘ技
和 服 务 器 端 之 间 的 数 据 传 输 量 大 ，而 且 耗 时 长 ， 后
一
术能 够很好 地解决这 个 问题 。
ajax技术原理
ajax技术原理Ajax是一种用于创建交互式Web应用程序的技术，它可以让Web页面可以在不刷新整个页面的情况下向服务器发送请求并获取数据，然后在页面中动态地显示它们。
Ajax技术是基于多种技术的复杂集成，它涉及到浏览器端JavaScript、DOM、XMLHttpRequest对象、服务器端脚本等多个方面。
本文将针对Ajax技术的原理、工作流程、技术架构等方面进行详细的介绍。
一、Ajax技术的原理Ajax全称为Asynchronous JavaScript and XML，它最初是由Jesse James Garrett提出的一种Web开发技术，Ajax技术的核心思想是使用JavaScript和XMLHttpRequest对象来与服务器异步通信，从而实现页面的更新，而不需要刷新整个页面。
在使用Ajax技术前，Web应用程序需要刷新整个页面，同时每次页面刷新会向服务器发送一次请求，导致页面响应延迟，影响用户体验。
而使用Ajax技术后，浏览器可以只更新部分页面，不需要刷新整个页面，同时可以多次向服务器请求数据。
Ajax技术的原理是基于JavaScript语言，通过JavaScript语法实现浏览器与服务器之间的异步通信。
在Web页面中，我们可以通过JavaScript创建一个XMLHttpRequest对象，然后使用该对象向服务器发送请求并获取数据。
发送的请求类型可以是各种不同的请求类型，比如GET、POST、PUT、DELETE等。
服务器接收到请求后，会对请求进行处理，并将响应数据返回给浏览器。
浏览器接收到响应数据后，就可以将其显示到页面中，完成页面的更新，而不需要刷新整个页面。
二、Ajax技术的工作流程Ajax技术的工作流程是由浏览器端和服务器端两部分组成。
浏览器端负责通过JavaScript创建XMLHttpRequest 对象，然后向服务器发送HTTP请求。
在服务器端，接收到HTTP请求后，服务器会根据请求类型进行相应的处理，然后将处理结果返回给浏览器。
在IntelliJ IDEA中部署web项目的详细过程(从外部导入项目)
首先在web工程文件夹中找到带.ipr后缀的文件双击打开
之后点击Tools下面那个按钮
进入Project Structure界面
之后选择
Modules选项
进入Paths里面进行设置
选择Use module compole output path选项
会出现
在Output path里面选择你的web工程根目录Web-INF下面的classes目录，若没有该目录的话则需自己创建
再则Test output path的路径需要和Output path路径一致。
配置好之后进入
Dependencies界面里进行环境依赖配置
把你所需要的架包选择进去
点击Apply之后进行之后的操作
之后进行tomcat的输出路径进行配置
进入Artifacts界面里进行配置
在Output directary里选择你本机的tomcat所在位置的webapps所在路径进行配置
点击OK进行确定
点击Apply之后进行之后的配置
若是第一次配置则需要在Project中进行JDK的配置
若是多次配置了则不需要
到此Project Structure配置基本完成
之后在
Refactor下面的那个按钮
选择
进行tomcat的配置，点击之后进入下面界面
点击按钮在一系列服务中选择tomcat
选择local进行tomcat配置之后进入下面界面
Name:可以选择修改也可以不修改之后点击Fix按钮进入
在你的项目中打上选择确认就基本完成培训。
若运行不成功则需要在
中填入你项目的前缀
部署基本完成。
ajax工作原理
ajax工作原理Ajax工作原理什么是Ajax？Ajax全称为Asynchronous JavaScript and XML，即异步 JavaScript 和 XML，是一种可以在不重新加载整个网页的情况下更新部分网页的技术。
它可以通过JavaScript向服务器发送请求并接收响应，然后使用JavaScript和DOM实现局部刷新，从而具有快速响应、提高用户体验等优点。
Ajax的工作方式1.通过XMLHttpRequest对象向服务器发送请求2.服务器接收到请求后处理请求，并返回相应的数据3.XMLHttpRequest对象接收到服务器返回的数据后，使用JavaScript和DOM技术对网页进行局部更新XMLHttpRequest对象XMLHttpRequest对象是Ajax的关键，它是由IE5引入的，现在已经成为大多数浏览器都支持的标准。
通过XMLHttpRequest对象，JavaScript可以和服务器进行数据交互。
XMLHttpRequest对象提供了一组方法用于向服务器发送请求、接收响应，并对请求状态进行处理。
其中常用的方法有：•open()：初始化一个请求•send()：发送请求•abort()：取消当前请求Ajax的优点•增强用户体验：因为局部更新可以避免整个页面的重载，从而提高了用户体验和交互效果•提高性能：由于不需要每次重新加载整个页面，所以可以减少带宽的浪费和请求次数，从而可以提高网页的加载速度•易于使用：Ajax的应用可以与JavaScript、HTML和CSS等现有的Web技术结合使用，且容易掌握和实现Ajax的缺点•对搜索引擎不友好：将部分页面放在JavaScript中，搜索引擎对这些页面的抓取不友好，从而影响了SEO•对应用程序的开发难度较大：因为使用Ajax需要同时掌握JavaScript、XML以及Web服务器端技术的知识，因此初学者需要投入更多的时间和精力结论虽然Ajax有其自身的优缺点，但是它已经成为Web前端的基础技能之一。
从零开始学习Ajax：Web开发技术实战
说到AJAX，您会想到什么？球迷的第一反应或许是荷兰的阿贾克斯足球队。
而本文的AJAX，指的是一种网页开发技术。
在WWW被笑称为Wait，Wait，Wait的时代，AJAX大放异彩，AJAX提供的一步交互技术，可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。
何谓AJAX？AJAX(Asynchronous JavaScript and XML)是一种创建交互式网页应用的网页开发技术。
AJAX使用JavaScript编写的 XMLHttpRequest 对象与与服务器通信。
使用XMLHttpRequest，浏览器向Web 服务器发送异步HTTP请求，页面无需重载即可与Web 服务器交换数据。
AJAX技术的标准实现是XMLHttpRequest(简称XHR)对象。
XHR可以调用类似jQuery等相关JS库例。
下面给一个示例代码，来演示如何使用XHR。
1. 创建XMLRequest对象if (window.XMLHttpRequest) {xhr = new XMLHttpRequest();} else if (window.ActiveXObject) {xhr = new ActiveXObject("Microsoft.XMLHTTP");}2. 构造浏览器向服务器发送的异步HTTP请求URLxhr.open("GET","my-dynamic-content.jsp?id="+encodeURI(myId),true);3. 指定回调函数接收服务器端响应xhr.onreadystatechange = function(){processReqChange(req);}4.浏览器向服务器端发送XRH请求xhr.send(null);如果使用同步方式，待客户端请求发送后，要做的是等待服务器端的响应。
有时是干等，因为服务器因服务忙，或者网络延迟原因响应很慢。
如何使用Ajax技术开发Web应用程序
如何使用Ajax技术开发Web应用程序在当今的 Web 开发领域，Ajax 技术已经成为了构建动态、交互性强的 Web 应用程序的重要手段。
Ajax 全称为 Asynchronous JavaScript and XML（异步 JavaScript 和 XML），它能够在不刷新整个页面的情况下，与服务器进行数据交换，从而实现页面的局部更新，为用户提供更加流畅和高效的体验。
接下来，让我们深入探讨一下如何使用Ajax 技术来开发 Web 应用程序。
一、Ajax 技术的基本原理要理解如何使用 Ajax 技术，首先需要了解其基本原理。
Ajax 主要依赖于 JavaScript 中的 XMLHttpRequest 对象来与服务器进行通信。
通过创建这个对象，我们可以向服务器发送请求，并处理服务器返回的响应。
当用户在页面上进行某个操作（比如点击按钮、输入内容等）时，JavaScript 代码会使用 XMLHttpRequest 对象发送一个异步请求到服务器。
服务器接收到请求后，进行相应的处理，并将结果以特定的格式（如 XML、JSON 等）返回给客户端。
客户端的 JavaScript 代码接收到响应后，对数据进行解析和处理，然后更新页面的相关部分，而无需重新加载整个页面。
二、创建 XMLHttpRequest 对象在 JavaScript 中创建 XMLHttpRequest 对象的方式如下：｀｀｀javascriptvar xhr ＝ new XMLHttpRequest(）；｀｀｀创建好对象后，我们需要设置请求的方法（GET 或 POST）、请求的 URL 以及是否异步等参数。
三、发送请求设置好请求参数后，就可以使用｀open(）｀方法和｀send(）｀方法来发送请求。
｀｀｀javascriptxhropen(＇GET'，＇ true)；xhrsend(）；｀｀｀在上述代码中，｀GET` 表示请求方法，｀｀是请求的 URL，｀true` 表示异步请求。
AJAX技术在WEB系统中的应用
ＳＯ ＴＮＧ２ Ｎ ｛ ＣＥ Ｅ０Ｙ ． Ｉ ＆ＣＬ １ＯＩ Ｅ Ｈ０ ０ ．ｊ Ｎ 。。圆 ０ ０４
ＡＪ ＡＸ技术在 Ｗ Ｂ系统 中的应 用 ห้องสมุดไป่ตู้Ｅ
李 致 群 （ 津市信息 中心 天津 ３ ０ ２ ） 天 ０ ２ １ 摘 要 ： Ｊ Ｘ 建立在Ｊ ｖ Ｓ ｒ ｔ Ｍ 技术之 上 的一 门综合 性技 术 ， 工作 原理实现 对 网络 信息 传递的异 步交 互过 程 。 Ｅ ＡＡ 是 ａ ａ ｃｉ 和Ｘ Ｌ ｐ 其 在Ｗ Ｂ系统 中， Ａ Ａ ， 术 具有传 统技术 无法 比拟 的优点 。 ＪＸｔ ｔ ． 本文 以ｂｏ 中的用 户调查投 票 系统作 为程 序 的实例 ， 绍 了Ａ Ａ 技术 在Ｗ Ｂ系统 中的应 用。 ｌ ｇ 介 ＪＸ Ｅ 关键词 ： Ｊ Ｘ Ｅ 应 用 ＡＡＷ Ｂ 中 图分 类 号 ： Ｐ Ｔ ３ 文献 标 识 码 ： Ａ 文 章编 号 ： ６ ２ ７ １ｇ １ ） ２ ａ一Ｏ １ —０ １ ７ －３ ９ （ ｏ ０ （） ０ ７ １ Ｏ
加 载 ＡＪ ＡＸ 引 擎 。 个 Ａ Ｊ 这 ＡＸ的 引 擎 用
一
ｆｒａｈ ｓ ｉｇ ｉ ｍ ｉ ｔ ）／ ｏｅｃ （ ｒｎ ｔ ｎ ｉ ｍｓ／ 投票 ｔ ｅ ｅ
记 数
依 据 网站 建设 的 总 体 目标 和 应 用 功 能
｛
Ｘｍｌ ｏ ｅ ｎ （ ｍｌ ｌｍｅ ｔ ｏ ｔ Ｎ ｄ Ｘ ＝ （ Ｘ Ｅｅ ｎ ） ｏ ． ｒ Ｃ ｉ Ｎｏ ｅ［ ｏ ｖ ｒ． ｏｎ ３ （ ｅ ］． ｈｌ ｄ ｓ ｎ ｅ ｔ Ｔ Ｉ ｔ２ｉ ｍ） ｄ Ｃ ｔ ）
ｗｅ ｌｇ简称 Ｂｏ ） ｂ ｂｏ （ ｌｇ是Ｗ Ｅ ２０ Ｂ ．应用 的
体 来 说 ， 是ＡＪ 就 ＡＸ技 术 在程 序 用 户 和 数据 代 表 。 火如 荼 的 Ｂ ｏ 为 互 联 网时 代 人们 如 ｌｇ， 从 而 避 免 了 以 往在 数据 信 处 理 过 程 中 的处 大 量 的 Ｂ ｏ 用 户 ， 够有 一 个 动 态 的 影 响 ， ｌｇ 能 理 与 等 待 的 无 谓 过 程 ， 大 提 高 了 数 据 处 并迅 速 作 出反 应 ， ｌｇ 吸 引更 多的 用 户使 大 Ｂｏ 会
AJAX基础教程PPT课件
}设置返回ຫໍສະໝຸດ 务器返回数据类型的MIME格式http_request.overrideMimeType(“text/xml”);
} else { // 页面有问题} } else { // 信息还没有返回，等待}
16
16
.
处理服务器返回
❖ XMLHttpRequest成功返回的信息有两种处理方 式：
▪ responseText该属性以字符串的形式返回响应的值 ▪ responseXML该属性将返回结果作为一个XML的
DOM文档返回，可以执行DOM处理。
3
3
.
传统Web应用同步处理
❖ 传统的Web应用采用同步交互过程。
4
4
.
传统Web应用同步处理
❖ 传统的Web应用采用同步交互过程。
5
5
.
传统Web应用同步处理
❖ 传统的Web应用中，用户单击一个链接后，待需 要等待，直到另外一个页面刷新显示。
❖ 如果仅仅需要改变页面的某一部分的内容，也不 得不刷新整个页面。
<h2>用户登录</h2> <hr/> <div id="msg"></div> <form name="loginform">
帐号：<input name="userid" type="text"/> <span id="userid.msg"></span><BR> 密码：<input name="pwd" type="password"/> <span id="pwd.msg"></span><BR> <input value="登录" type="button" onclick="checkUserLogin()"/> </form>
IntellijIDEA手册
使用IntelliJ IDEA开发Web项目一、打开IntelliJ IDEA 7.0.3 并新建一个工程文件：1、打开Intellij IDEA7.0.3，“File”——>“New Project”：2、“Next”：3、更改工程名字和存放路径，如以下例子：4、“Next”：5、这一步的操作是关联本机的jdk文件目录（第一次需要做，之后就不需要再设定了），找到自己本机里面的JAVA目录下的JDK的目录（如果找不到自己的JDK目录的，说明没有装JDK，那么可以先装JDK -7或者其他版本，然后再找到自己本地的JDK文件夹。
同时再装上JRE -7）。
JDK-7下载：/download.htmlJRE-7下载：/download.html6、因为我们要开发的是Web项目，所以勾选Web Application。
如果全部都不选，则新建一个纯项目工程。
到此为止，就应该新建了一个Web 的项目工程，并自动打开该工程。
二、开发Web项目（以一个例子说明）：1、打开新建的项目后，把左边的文件夹都展开，然后把Index.jsp文件删除，等一下我们会新建一个Html的文件：2、双击打开web.xml，可以修改字体的大小，按下下图的设置按钮：3、我们在这里新建一个自己的样式，并命名，如：myfont：修改字体样式，比如：修改字体大小，比如：15 ：4、设置工程的运行方式：在此，我们选择以Tomcat Server来打开项目：进行到这一步的时候，有可能没有安装Tomcat，那么就要先安装Tomcat（如Tomcat 7. 0）：Tomcat 7.0下载：/download-70.cgi或.skycn./soft/58951.html（安装教程user.qzone.qq./529901956/blog/1270043200）按下Fix按钮：5、新建Class文件：给Class文件一个名字，如：ClassicServer ：打开刚刚新建的Class文件之后，把预先准备好的代码复制进来（当然也可以自己写代码开发，这里作为一个例子，预先准备好了代码）：ClassicServer代码：把代码复制进来之后，作为演示，我们在这里先把public class以下的代码选中并且按Ct rl+/(?)键以把这段代码转换为注释：把public class以上的代码选中并删去：此时，有一部分代码会变成红色，说明这部分代码运行的时候会出错，于是我们把鼠标光标放在红色的代码上面，按下Alt+Enter，即可自动修复错误代码：6、新建Html或者Xhtml文件，这里我们新建的是Html文件：输入Index，不用加后缀，它会自动添加后缀名：双击打开Index.html，把预先准备好的代码复制输入（作为演示）：Index代码：<html><head><title></title></head><body>校验用户名是否存在的例子<br/><form action="ClassicServer" method="GET"> 用户名：<input type="text" name="name"/> <input type="submit" value="检验"/></form></body></html>切换到web.xml，手工输入以下蓝色区域的容，注意其中的ClassicServer要对应回Index. html里面的ClassicServer：7、切换到ClassicServer.java，再次选中public class以下的容，Ctrl+/(?)把代码恢复会代码模式：8、再次把鼠标光标放在红色的代码上面，按下Alt+Enter，即可自动修复错误代码：9、最后把项目部署到Tomcat Server上：点击绿色三角箭头按钮：点击Run按钮：按了Run按钮后，将会自动弹出一个页面显示出我们所做的web项目的容。
跟我学AJAX技术——如何应用AJAX技术实现级联菜单的Web应用示例
1.1跟我学AJAX技术——如何应用AJAX技术实现级联菜单的Web应用示例1.1.1常规的Web级联菜单所存在的问题以前，为了避免每次对菜单的操作引起的重载页面，不采用每次调用后台的方式，而是一次性地将级联菜单的所有数据全部读取出来并写入到数组中，然后根据用户的操作用JavaScript+CSS来控制它的子集项目的显示，这样虽然解决了操作响应的速度、不重载页面以及避免向服务器频繁发送请求的问题，但是如果用户不对菜单进行操作或者只对菜单中的一部分进行操作的话，那读取的数据中的一部分就会成为多余而浪费用户的资源，特别是在菜单的结构复杂、数据量大的情况下，这样的弊端就更为突出！而如果采用AJAX技术来实现（JavaScript+CSS+AJAX），在页面初始化的时候，我们只需要读出其一级菜单的数据并显示出。
而在用户操作时，则通过AJAX向后台请求其下一级的菜单数据并显示出------这样，需要什么就下载什么！1.1.2构建本示例的Web应用项目1、添加一个JSP页面ajaxMenu.jsp（1）创建ajaxMenu.jsp页面文件（2）在该页面中添加一个表格，并且在其中放上超链接<%@ page language="java" pageEncoding="GB18030"%><%@ taglib uri="/tags-bean" prefix="bean" %><%@ taglib uri="/tags-html" prefix="html" %><%@ taglib uri="/tags-logic" prefix="logic" %><%@ taglib uri="/tags-tiles" prefix="tiles" %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html:html lang="true"><head><html:base /><script language="javascript" src="ajaxMenu.js"></script><title>ajaxMenu1.jsp</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--></head><body><table width="200" border="0" cellspacing="0" cellpadding="0"> <tr><td height="20"><a href="#" onclick="showSubMenu('menu_1')" >菜单一</a></td></tr><tr><td height="20" id="menu_1" style="display:none"> </td></tr><tr><td height="20"><a href="#" onclick="showSubMenu('menu_2')">菜单二</a></td><tr ><td height="20" id="menu_2" style="display:none"> </td></tr></table></body></html:html>（3）ajaxMenu.jsp页面文件的预览示图2、再添加JavaScript的文件ajaxMenu.js（1）创建JavaScript文件ajaxMenu.js（2）编程ajaxMenu.js文件中的功能实现代码var httpRequest;var currentPos;function showSubMenu(newCurrentPos){document.getElementById(newCurrentPos).parentNode.style.display="";currentPos=newCurrentPos;if(document.getElementById(newCurrentPos).style.display == "none"){document.getElementById(newCurrentPos).style.display = "";sendRequest("/AJAXWebApp/ajaxmenu.do?playPos="+newCurrentPos);}else{document.getElementById(newCurrentPos).style.display = "none";}}function sendRequest(requestURL){httpRequest=getHTTPRequestObject();httpRequest.onreadystatechange = processHttpResponse;httpRequest.open("GET", requestURL, true); // Get 请求方式的代码httpRequest.send(null);}function getHTTPRequestObject(){var httpRequestObject;if (window.XMLHttpRequest){ // Mozilla, Safari, ...httpRequestObject = new XMLHttpRequest();}else if (window.ActiveXObject){ // IEtry{httpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");}catch (e){try{httpRequestObject= new ActiveXObject("Msxml2.XMLHTTP");}catch (e2){alert("您的浏览器有问题！");}}}return httpRequestObject;}function processHttpResponse (){if (httpRequest.readyState == 4){if (httpRequest.status == 200){ //检查是否成功接收了服务器响应parseResponseText();}else if(httpRequest.status == 404){alert("没有找到与所请求的文件相匹配的资源！");}else{alert("你所请求的页面发生异常，错误代码为："+httpRequest.status);}}else{document.getElementById(currentPos).innerHTML = "检测中，请稍等...";}}function parseResponseText(){document.getElementById(currentPos).innerHTML=httpRequest.responseText;}function LoadJS(file) //动态加载JS文件{var head = document.getElementsByTagName('HEAD').item(0);var script = document.createElement('SCRIPT');script.src = file;script.type = "text/javascript";head.appendChild(script);}3、添加一个Action类（1）切换到可视化设计视图（2）设置类名称为AjaxMenuAction，程序包名称为com.px1987.webajax.action /ajaxmenu（3）将产生出下面的Action类（4）编程AjaxMenuAction程序类中的功能实现方法package com.px1987.webajax.action;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.apache.struts.action.Action;import org.apache.struts.action.ActionForm;import org.apache.struts.action.ActionForward;import org.apache.struts.action.ActionMapping;import java.io.*;public class AjaxMenuAction extends Action{public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) {response.setContentType("text/html; charset=GBK");try{PrintWriter out = response.getWriter();String playPos = request.getParameter("playPos");if(playPos.equals("menu_1")){ //实际可以访问数据库表来获得各个子菜单项目String subMenuText=" <a href='#'>菜单一中的子菜单一</a><br>"+" <a href='#'>菜单一中的子菜单二</a><br>"+" <a href='#'>菜单一中的子菜单三</a>";out.write(subMenuText);out.close();}else if(playPos.equals("menu_2") ){String subMenuText=" <a href='#'>菜单二中的子菜单一</a><br>"+" <a href='#'>菜单二中的子菜单二</a><br>"+" <a href='#'>菜单二中的子菜单三</a><br>"+" <a href='#'>菜单二中的子菜单四</a>";out.write(subMenuText);out.close();}}catch(IOException e){System.out.println(e.getMessage());}return null;}}4、执行该功能（1）部署本示例项目（2）输入http://127.0.0.1:8080/StrutsAJAXWebApp/ajaxMenu.jsp（3）点击上面的菜单的链接，将展开对应的菜单项目（4）如果再次点击上面的菜单的链接，将关闭对应的菜单项目。
浅谈Ajax在WEB开发中的使用
入 的资金 ，不 断依 据 实际生 产经 营情 况创 新本 控制 系统 的管 理模 划方 案来 开发 、完 善用 户前 台 。这类 方案 几乎支 持全 部 常用 到的 式 与手段 ，以便更 好地 管控 系统 。该 控制 系 统在 应用 的过程 中 能 操作 系统 以及 数据库 ， 并被广 泛 、 刻地应 用在 搭建 服务 器之 中 。 够控 制若 干个 模式 ，实现远 程通 信 ，并且 系统 能够 平 稳、 高效 、 深 以开源 为主题 的规 划方 案也 带动 了项 目安 全性 能 的维护 ，大 幅度 快 速地 运行 。
为 了实现过 程控 制软件 的平 稳性 和安 全性 ， 系统 在 Ｗｅ 本 ｂ页
面上 添 加 了 Ａ Ａ 技 术 ，能 让系 统 的运 行 更畅 通无 阻， 并促 进 ＪＸ
『 ３苏绍 兴， ３ ］ 李文一 于 ｗ ｅ 的分 布 式计 算机过 程 控制 实验 系 基 ｂ
Ｗｅ 服 务 器 和用 户 浏 览器 之 间开 展 页 面 的小 部 分区 域 的数 据 交 统 设计 【 ＿ 械 工业 出版社 ， １ ， ３ ｂ ｌ机 １ ２ １ １） ０ （ ｆ 徐 湘元 ， 宗 源一 ４ １ 毛 过程 控 制 的 发展 方 向～ 一 智 能控 制 Ⅱｌ 】 化 换 ，Ａ Ａ 安装 简单 、速度 较快 、性 能较 为平稳 ，并可 以跨平 台 Ｊ Ｘ 推广 、普 及 。不但可 以从根本 上 降低 Ｗｅ ｂ服务 器所 承受 的负荷 与 压 力 ，还 能使 网络 的流 量下 降 ，极大 地提 升 了系统 的工作 、运行
如需获 得来 自服 务器 的响应 ， 请使 用 Ｘ ＨｔＲ ｑ ｅ ＭＬ ｔ ｅｕｓ 象 ｐ ｔ对 的 ｒｓｏ ｓＴｘ ｅｐｎｅｅｔ或 ｒｓｏｓＸ ｅｐｎｅ ＭＬ 属性 。 ｒｓｏｓＴｘ ｅｐ ｎｅ ｅｔ属 性 如果 来 自服 务 器 的响 应 并 非 ＸＭＬ ，可 以使 用 ｒ ｐ ｎｅｅｔ ｅ ｏｓＴ ｘ ｓ 属性 。ｒｓｏ ｓＴｘ ｅｐｎｅ ｅｔ属 性返 回 字符 串形 式 的响 应 ，因此 我们 可 以 这样 使用 ：
浅析Ajax技术在Web开发中的应用
信息技术Chi 硪丽ZUIU NU ．／C h i n a N ewT e e h n o l o g i ：瞄圆团圈汪汪ii _P8M d P ⅫIucI “■嵋誓—‘山‘誓●i ■I ■-工■浅析．A j ax ”技术在W eb 开发巾的应用杜阳(青岛科技大学，山东青岛266042)摘要：A S P ．ne t A j ax 实现了W eb 页面丰富的部分刷新效果。
本文通过介绍A S P ．net A j ax 原理。
总结了在W eb 开发应用中要注意的若干问题。
合理地利用A S P ．ne t A j ax 技术，W eb 开发数据库应用就能获得更好的交互效果。
关键词：A j a x 介绍；W e b 开发1引言当前，W eb 技术的不断发展使得B ／S 得以广泛地应用。
但W eb 传统的开发技术使得网页的交互性能大打折扣。
随着A j 盯技术的兴起。
W eb 开发技术超越了传统的开发模式．发生了质的飞跃。
而微软公司推出的A SP ．net A j ax 框架与A SP ．net 的结合，使得W eb 的开发方式在．net 环境下更加简单易用，页面交互性能也得到很大提高。
2A 泌相关介绍2．1A J 缸引擎的原理A j a)【(A sy nchr onous J avaS cr i pt a nd X M L)是现有多种技术的综合，包括J avaS cr i pt 、X H TM L 、C S S 、D O M 、X M L 、X ST L 和X M L —H t t pR eques t 。
A j ax 使用X H T M L 和C s S 标准化呈现数据，使用D O M 实现动态显示和交互数据，使用X M L 和X ST L 进行数据交换与处理，使用X M LH t t pR equest 对象进行异步数据读取，使用Java ．Scr i pt 绑定和处理所有数据11I 。
A J 麟为交互操作较多、数据读写频繁和数据分类良好的w eb 应用提供了一个很好的解决方案。
idea新建web项目教程
idea新建web项目教程在这个数字化时代，Web项目的需求越来越大。
对于想要尝试自己新建Web项目的人来说，了解该如何开始可能是一个挑战。
但是不用担心，本教程将指导您快速入门，帮助您理解新建Web项目的步骤和注意事项。
1.确定目标：在开始制定任何计划之前，您需要明确自己新建Web项目的目标。
您想要创建一个博客，一个电子商务平台还是一个在线工具？将您的目标明确化，有助于您更好地规划和实施项目。
2.选择合适的技术栈：根据您的项目目标，您将需要选择适合的技术栈来构建您的Web项目。
常见的技术栈包括HTML、CSS、JavaScript、PHP、Python和Ruby等。
根据您的需求和个人偏好，选择最适合您的技术栈。
3.规划项目结构：在开始编写代码之前，需要规划好您的项目结构。
这将有助于您组织和管理您的代码，使其更加可靠和易于维护。
在规划项目结构时，您可以考虑将项目拆分为不同的模块，例如前端、后端和数据库等。
4.创建前端界面：在新建Web项目时，前端界面是用户首先接触到的部分。
您可以使用HTML和CSS来设计和布局您的界面，JavaScript来添加交互性和动态效果。
确保您的前端界面易于使用和导航，同时也要考虑到不同设备上的响应式设计。
5.开发后端逻辑：一旦您的前端界面就绪，您将需要开发后端逻辑来处理用户的请求并返回相应的数据。
这包括与数据库的交互、验证用户身份、处理表单提交等。
根据您选择的技术栈，您可以使用PHP、Python等来开发后端逻辑。
6.测试和调试：在完成项目开发后，确保您进行全面的测试和调试是非常重要的。
您可以手动测试您的界面和功能，也可以使用自动化测试工具来减少测试工作量。
确保您的项目在不同的浏览器和设备上都能正常运行，并修复任何错误和问题。
7.部署和上线：一旦您完成了测试和调试，您就可以将您的Web项目部署到服务器上，并进行上线。
确定您选择了可靠的托管服务商，确保您的项目能够稳定和高效地运行。
最详尽的IntelliJIDEA项目web项目搭建！！！！！！
最详尽的IntelliJIDEA项⽬web项⽬搭建⼀、创建⼀个web项⽬（⾸次创建最⿇烦）1、保证安装好软件2、双击打开软件-->新建⼀个项⽬3、web项⽬选择如图，先建⽴⼀个空的项⽬空间来放置你的项⽬，这是⼀个区别相当于myeclipse 的如图4、建⽴项⽬的名称相当于myeclipse 的如图5、点击fininsh，会弹出如图所⽰，问你建⽴的项⽬是在此页显⽰，还是在新页显⽰，这个看你的需求，这⾥以新页为了，以跟我的之前项⽬区分。
（这是⼀个区别）6、这时会弹出如图的设置，需要设置使⽤的JDK，这⾥叫做SDK7、如果没有弹出，可以通过如下图打开设置8、这⾥设置我的JDK是1.7相当于myelipse 如下图位置的设置9、模板设置选择如图如图设置，建⽴项⽬类型是个web项⽬，然后需要有web.xml⽂档模板命名如果这时点finish ，就会发现⽣成⼀个web 项⽬样式，可以发现Web ⽂件夹下少⼀些东西与myeclipse⽐较（IntelliJ的web与myeclpse的webRoot相同）主要是少WEB-INF下的两个⽂件夹,这是web项⽬的输出⽂件夹,myeclipse在创建的时候,就⾃动⽣成了这两个⽂件夹,但是IntelliJ需要后期⾃⼰设置,这是他们两个的⼀⼤区别IntelliJ少了classes和lib⽂件夹,需要创建好后再另⾏设置,⽽myeclipse会在建⽴的时候设置,如图红圈位置⾃动设置图三显⽰设置web.xml和classes所属的⽂佳夹位置现在设置IntelliJ的classes和lib⽂件夹如图进⼊到如图位置进⼊到如图位置右键新建⽂件夹（classes和lib）注意：这⾥如果建⽴错误暂时不管，等项⽬整个ok了，再去删除⽐如在classes下多建⽴了⼀个lib先暂时不理会10、classes和lib输出路径设置选择Paths选择使⽤模板配置⾃⼰的路径上下两个要⼀致11、设置lib输出的路径选择第⼀个点击ok ，弹出如图，选择红圈完成后如图这时就会发现项⽬中的classes和lib设置成功了刚刚多余设置⼀个lib，在这⾥可以删除了感觉这个设计的有些⿇烦。
IntelliJIDEAWEB项目的部署配置
IntelliJIDEAWEB项⽬的部署配置1.前⾔虽说Intellij IDEA已经⽤了四个多⽉，⾥⾯⼤部分功能还是⽐较熟悉的，但是很多细节地⽅还是搞不清楚，这⼏天进公司接触⽼项⽬，因为是⾮maven项⽬，遇到了很多问题，⾃⼰⼜研究了⼀番，下⾯整理⼀下2.项⽬配置（Project Structure）2.1 Projectproject compliler output：配置的是项⽬中的默认编译输出总⽬录⾥⾯英⽂也说明了，每个模块可以⾃⼰设置特殊的输出⽬录所以这个基本上没⽤2.2 Modules项⽬的模块，⼀个项⽬中可以有多个⼦项⽬，每个⼦项⽬相当于⼀个模块⼀般我们项⽬只是单独的⼀个，所以只需要配置⼀个模块，我们可以给模块添加框架根据我们项⽬中的使⽤到东西，添加对应的框架，并在框架⾥⾯确定⼀下相关的配置⽂件（因为不同IDE下，项⽬的⽂件结构可能不同所以导⼊的项⽬我们要注意⼀下配置）模块配置根⽬下分为了三个标签：Sources—— Paths—— DepedenciesSources标签下主要显⽰项⽬的⽬录资源那些是项⽬部署的时候需要的⽬录有颜⾊提⽰（⽐如绿⾊是测试⽬录橘⾊是target的⽬录这些部署的时候都不需要⼤红⾊是我的项⽬下没有的蓝⾊是真正需要部署）Paths标签下可以指定项⽬的编译输出⽬录也就是项⽬类和测试类的编译输出地址（替换掉了Project的默认输出地址）Depedencies是项⽬的依赖我们可以点击右侧的+号添加lib ⽐如tomcat的lib 默认加进来就是Provided（和maven的⾥⾯的jar依赖差不多）Provided 也就是项⽬部署的时候是忽略的只是再编译项⽬的时候进⾏使⽤Compile 是跟随着项⽬部署的 Test也是不部署的2.3 Libraries⾥⾯可以添加项⽬jar包并且可以把多个jar放在⼀个组⾥⾯类似于jar包整理这个下添加的jar 会在Depedencies中显⽰（反之不可以）2.4 Facts项⽬的门⾯，说实话，真不知道这个是⼲嘛的，和modules差不多，主要是为了确认⼀下吧2.5 Artifacts项⽬的打包部署设置，这个是项⽬配置⾥⾯⽐较关键的地⽅注意红框的地⽅第⼀个是我们需要添加项⽬的部署包注意选择是exploded的war包第⼆个是项⽬的输出⽬录⾮maven项⽬这个可以设置到任何地⽅（ maven项⽬的需要特殊注意这个后⾯再说）第三个是输出结构（output layout）参考图中的⼏个⽂件（maven项⽬如果不使⽤maven的打包编译注意图中WEB-INF下的lib要有项⽬部署的jar）3.⾮Maven项⽬的创建部署创建File——New Project——Java——Web Application（注意New Project⾥⾯不是选择的web ⽽是java）intellij中web项⽬默认⽹页根⽬录是web项⽬配置可参考2中的⼏个地⽅根据⾃⼰的需求⾃⼰修改artifact中out directory 可以指定到任何地⽅项⽬打包编译到指定的⽬录下在intellij中启动tomcat 都会以对应war包out directory的设置的⽬录为⼯作空间tomcat配置请参考中的2-74.Maven项⽬的部署在intellij中 maven项⽬还是可以按照maven的打包编译参考图中的⼏个⽣命周期⼿动去执⾏因为maven项⽬的约定是项⽬打包编译到 target⽬录下所以我们在2中配置都应该去遵循maven的配置约定进⾏修改这样我们的项⽬在⽂件修改或者热部署的时候 intellij的编译才能和maven项⽬保持⼀致（如果是在intellij中创建maven项⽬那个intellij会给你配置好所有的配置基本不⽤修改我们可以创建⼀个springmvc的例⼦进⾏参考）需要注意的地⽅是：maven项⽬ artifact中out directory 的⽬录名⼀定要和pom⽂件中build的finalName⼀致另外pom⽂件中要配置<packaging>war</packaging>⽐如pom中配置的项⽬bulid finalName叫做ROOT那么我们的out directory为 E:\项⽬积累\test1\target\ROOT通过maven编译以及打包项⽬后在服务器的配置中，可以去掉下图红⾊区域的两个选项，避免每次启动时都重新编译和打包5.总结本⽂基本总结了intellij中web项⽬部署的问题，以及如何去配置，因为⽹上也没有很具体的说明，所以这些都是⾃⼰摸索出来的，有不对的地⽅欢迎⼤家指正。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
传智播客ajax视频教程：王兴魁
IntelliJ IDEA 8.1.2 for windows 下载地址：/softdown/34282_2.htm KeyGen下载地址：/archives/625.html
Ajax：Asynchronous Javascript and XML
Ajax实际上涵盖了5方面的内容：
(1) 使用XHTML和CSS的基于标准的表示技术
(2) 使用DOM进行动态显示和交互
(3) 使用XML和XSLT进行数据交换和处理
(4) 使用XMLHttpRequest进行异步数据检索
(5) 使用Javascript将以上技术融合在一起
传统的处理方式：在页面提交后客户端会有一段时间的空白，等待服务器返回新的信息。
Ajax处理方式：用XMLHTTPRequest控件自动提交，页面没有刷新，用户的体验不会中断。
Ajax虽然名字中含有XML，但是Ajax很多时候并不是用XML进行数据交换的，而是使用JSON。
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。
易于人阅读和编写，同时也易于机器解析和生成。
它基于JavaScript（Standard ECMA-262 3rd Edition - December 1999）的一个子集。
JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C, C++, C#, Java, JavaScript, Perl, Python等）。
这些特性使JSON成为理想的数据交换语言。
Ajax 能做什么？
(1) 改善表单验证方式，不再需要打开新页面，也不再需要将整个页面数据提交。
(2) 不需刷新页面就可以改变页面内容，减少用户等待时间。
(3) 按需获取数据，每次只从服务器端获取需要的数据。
(4) 读取外部数据，进行数据处理整合。
(5) 异步与服务器进行交互，在交互过程中用户无需等待，仍可继续操作。
IntelliJ IDEA界面：
IntelliJ的Project相当于Eclipse中的WorkSpace，而IntelliJ的Module相当于Eclipse中的Project。
新建WorkSpace（在IntelliJ中为Project），在下面的页面中选择JSDK，路径指向JDK的安装目录，点击OK后界面如下：
WorkSpace名称为AjaxTrain，主界面如下图：
点击“Settings”打开设置窗口，选择“Font”后打开设置窗口，“Scheme name”为“Default”的是不能修改的，点击“Save As”新建一个，名称为w。
设置字体为“Courier New”（将“Show only monospaced fonts”前的勾去掉可以显示全部字体，Eclipse中使用的字体就是“Courier New”，字体大小改为14）。
配置部署使用Tomcat：
在出现的界面中选择配置Tomcat就可以了。
apache-tomcat-6.0.29下载地址：/download-60.cgi#6.0.29
下载完Tomcat后运行bin目录里面的startup.bat，提示缺少CATALINA_HOME、JAVA_HOME、 JRE_HOME，在startup.bat中rem后面增加下面几行：
set CATALINA_HOME=E:\SoftWare\DB\apache-tomcat-6.0.29
set JAVA_HOME=C:\Program Files\Java\jdk1.6.0_20
set JRE_HOME=C:\Program Files\Java\jre6
实际环境中的地址与上面的可能不同。
IntelliJ中的配置如下图：
勾选红框中的“Deploy web fact 'Web'”，点击“OK”配置完成。
快速修复：Alt+Enter，修复完一处后光标自动跳转到下一处，所以按几次Alt+Enter后就可以把错误都修复了。
直接双击工程可以打开界面设置<Servlet-mapping>：。