在jsp中怎么运用ajax 如何使用Ajax技术开发Web应用程序
在jsp中怎么运用ajax
ajax其实他是多种技术的混合的混合。其实早就有了，
主要包含了以下几种技术：
Ajax（Asynchronous JavaScript XML）的定义
基于web标准（standards-based presentation）XHTML CSS的表示；
使用 DOM（Document Object Model）进行动态显示及交互；
使用 XML 和 XSLT 进行数据交换及相关操作；
使用 XMLHttpRequest 进行异步数据查询、检索；
使用 将所有的东西绑定在一起。英文参见Ajax的提出者Jesse James Garrett的原文a 类似于DHTML或LAMP，AJAX不是指一种单一的技术，而是有机地利用了一系列相关的技术。事实上，一些基于AJAX的“派生/合成”式（derivative/composite）的技术正在出现，如“AFLAX”。
呵呵，不就是JavaScript、XML、CSS等的结合嘛。现在该知道怎么用了吧？
如何使用Ajax技术开发Web应用程序
一、简介
AJAX，一个异步JavaScript和XML的缩略词，是最近出来的技术词语。异步意味着你可以经由超文本传输协议(HTTP)向一个服务器发出请求并且在等待该响应时继续处理另外的数据。这就意味着，例如，你可以调用一个服务器端脚本来从一个数据库中以XML方式检索数据，把数据发送到存储在一个数据库的服务器脚本，或者简单地装载一个XML文件以填充你的Web站点而不需刷新该页面。然而，在这项新技术提供巨大能力的同时，它也引起了在"Back"按钮问题上的很多争论。本文将帮助你确定在真实世界中何时使用AJAX是最佳选择。
首先，我假定你对缩略词JavaScript和XML部分有一个基本了解。尽管你能通过AJAX请求任何类型的文本文件，但是我在此主要集中讨论XML。我将解释怎样在真实世界中使用AJAX以及怎样在一个工程中评估它的价值。在你读完本文后，你将会明白什么是AJAX，在什么情况下，为什么以及怎样使用这项技术。你将要学习，在保持给用户提供直观体验的同时怎样创建对象，发出请求以及定制响应。
我已创建了一个适合于本文的示例工程(你可以下载源代码)。这个示例实现了一个简单的请求-它装载一个包含页面内容的XML文件并且分析数据以把它显示在一个HTML页面中。
二、常规属性和方法
表1和2提供了一个属性和方法的概述- 它们为Windows Internet Explorer 5，Mozilla，Netscape 7，Safari 1.2，和Opera等浏览器所支持。
表1属性
属性 描述
onreadystatechange 当请求对象变化时该事件处理器激活。
readyState 返回指示对象的当前状态的值。
responseText 来自服务器的响应串的版本 。
responseXML 来自服务器的响应的DOM兼容的文档对象。
status 来自服务器的响应的 状态码。
statusText 以一个字符串形式返回的状态消息。
表2方法
方法 描述
Abort() 取消当前HTTP请求。
getAllResponseHeaders() 检索所有的HTTP头值。
getResponseHeader("headerLabel") 从响应体中检索一个HTTP头部的值。
open("method","URL"[,asyncFlag[,"userName" [,"password"]) 初始化一个MSXML2.XMLHTTP请求，并从该请求指定方法，URL和认证信息 。
send(content) 发送一个HTTP请求到服务器并接收响应。
setRequestHeader ("label", "value") 指定一个HTTP头的名字。
三、从哪里开始
首先，你需要创建XML文件-后面我们对之进行请求并作为页面内容进行分析。你正在请求的文件必须与 目标工程驻留在相同的服务器上。
下一步，创建发出请求的HTML文件。当页面通过使用页面主体 中的onload方法进行加载时，该请求发生。接着，该文件需要一个有ID的div标签，这样当我们准备好要 显示内容时就可以对之进行定位。当你做完所有这些，你的页面的主体上去，如下：
＜body onload="makeRequest(xml/content.xml) "＞
＜div id="copy"＞＜/div＞
＜/body＞
四、创建请求对象
为了创建请求对 象，你必须检查是否浏览器使用XMLHttpRequest或ActiveXObject。这两个对象之间的主要区别在于使用 它们的浏览器。Windows IE 5 及以上版本使用ActiveX对象 而Mozilla，Netscape 7，Opera和Safari 1.2及以上版本使用XMLHttpRequest对象。另外一个区别是你创建对象的方式：Opera，Mozilla， Netscape和Safari允许你简单地调用该对象的构造器，但是Windows IE需要把对象的名字传递到ActiveX 构造器中。下面是怎样创建代码来决定要使用哪个对象和怎样创建它的示例：
if (window.XMLHttpRequest)
{ request = new XMLHttpRequest() }
else if (window.ActiveXObject)
{ request = new ActiveXObject("MSXML2.XMLHTTP") }
五、发出请求
现在既然你已经创建了你的请求对象，那么你已经为向服务器发 出请求作了准备。创建一个到事件处理器的参考以听取onreadystatechange事件。然后，该事件处理器 方法将在状态发生变化时作出响应。一旦我们完成请求，我们就开始创建这个方法。打开连接以GET或 POST一个定制的URL-在此是一个content. xml，并且设置一个布尔定义-是否你想要进行异步调用。
现在到了发出请求的时间了。在这个示例中，我使用了null，因为我们使用的是GET 为了使用 POST，你需要使用下面这个方法发出一个查询串：
request.onreadystatechange = onResponse
request.open("GET". url, true)
request.send (null)
六、定制加载和错误处理消息
你为onreadystatechange方法创建的事件处理器 正是集中进行加载和处理错误的场所。现在到了考虑用户并针对他们与之交互的内容的状态提供反馈的 时候了。在这个实例中，我针对所有的装载状态代码提供反馈，并且也对最经常发生的错误处理状态代 码提供一些基本的反馈。为了显示请求对象的当前状态，readyState属性包括显示在下表中的一些值。
值 描述
0 未初始化，对象没有用数据进行初始化。
1 装载中，对象正在装载它 的数据。
2 装载结束，对象完成了它的数据的装载。
3 可交互，用户能与对象交互了， 尽管它还没有装载结束。
4 完成，对象已经完全被初始化。
W3C中有很长的一串有关HTTP 状态代码的定义。我选择了两个状态代码:
200:请求成功了。
404:服务器没有找到与所 请求的文件相匹配的任何东西。
最后，我检查任何另外的状况代码-它们将生成一个错误并提供 一个一般错误信息。下面是一个代码示例-你可以用之来处理这些情况。注意，我在定位我们前面在HTML 文件的主体中创建的div ID并且对它应用装载和/或错误信息-通过innerHTML方法-这个方法用于设置在 div对象的开始和结束标签之间的HTML:
if(obj.readyState == 0)
{ document.getElementById(copy).innerHTML = "Sending Request..." }
if(obj.readyState == 1)
{ document.getElementById(copy).innerHTML = "Loading Response..." }
if(obj.readyState == 2)
{ document.getElementById(copy).innerHTML = "Response Loaded..." }
if(obj.readyState == 3)
{ document.getElementById(copy).innerHTML = "Response Ready..." }
if(obj.readyState == 4){
if(obj.status == 200){ return true }
else if(obj.status == 404)
{
// 添加一个定制消息或把用户重定 向到另外一个页面
document.getElementById(copy).innerHTML = "File not found"
}
else
{document.getElementById(copy).innerHTML = "There was a problem retrieving the XML." }
当状况代码为200 时，这意味着请求成功。下面开始进行响应了。
七、分析响应
当你准备好分析来自请求 对象的响应时，真正的工作开始了。现在你可以用你请求的数据开始工作。仅为测试目的，在开发期间 ，可以使用responseText和responseXML属性来显示来自响应的原始数据。为了存取XML响应中的结点， 首先使用你创建的请求对象，定位到responseXML属性以检索(你可能已经猜测出来)来自响应的XML。定 位到documentElement-它检索一个到XML响应的根结点的参考。
var response = request.responseXML.documentElement
现在既然你有了到响应的根结点的参考，那么你可以使 用getElementsByTagName()以结点名字来检索childNodes。下面一行用一个头部的nodeName来定位一个 childNode：
response.getElementsByTagName(header) [0].firstChild.data
使用firstChild.data可以允许你存取该元素中的文本：
response.getElementsByTagName(header)[0].firstChild.data
下面是怎样 创建这些代码的完整的例子：
var response = request.responseXML.documentElement
var header = response.getElementsByTagName (header)[0].firstChild.data
document.getElementById (copy).innerHTML = header
八、需求分析
现在既然你知道怎样使用 AJAX的基础知识，那么下一步就是决定是否在一工程使用它。须记住的最重要的事情是，在你还没有刷 新页面时你无法使用"Back"按钮。为此，可以先专注于你的工程中的一小部分-它能够从使用 这种类型的交互中受益。例如，你可以创建一个表单-它在用户每次输入一个输入字段或一个字母时查询 一个脚本以便进行实时校验。你可以创建一个拖放页面-在释放一项时，它能够把数据发送到一个脚本中 并把该页面的状态保存到一个数据库中。使用AJAX的理由毫无疑问是存在的 并且这种使用无论对开发 者还是用户都会带来益处 这全依赖于具体的条件和执行情况。
还有其它方法可用来解决 "Back"按钮的问题，例如使用Google Gmail-它现在能够为你的操作提供一种撤消功能而不刷 新该页面。以后还会出现许多更具创造性的例子-它们将通过提供给开发者创建独特实时的体验的手段给 用户带来更大的好处。
九、结论
尽管AJAX允许我们构建新的和改进的方式来与一个WEB页 面进行/交互 但是作为开发者，我们需要牢记产品是不考虑技术的 它关心的是用户以及其如何与用户 进行交互。没有了用户群，我们构建的工程毫无用处。基于这个标准，我们就能评估应该使用什么技术 以及何时使用它们来创建对相应用户有用的应用。
ajax应该如何应用？
首先我建议把所有技术都丢下，ajax到底做了什么，每当get或者post一个页面我们成为一次请求，也就是有一个页面进入另一页面，那么此页面的所有信息自然会参照上一次请求．这样我们发现有问题产生了，一，我们请求的数据量太大，一直Web下无法实现．二，有些请求的局域我们在一些范围内未知．好了，我想ajax就是做这件事的．他能把请求不通过一次页面的传递发送过去．这里我并不同意ajax用来改善用户体验一说，他确实改变了用户体验但不一定是改善． 对于我上诉的两个问题我将具体说明aja的应用． 不同请求固定数据.对于固定的数据采用不同请求是为了解决此固定数据非常庞大以至于无法在网络现实中实现,而且此不同请求的差异上有着连续性.比如Google MAP，对于不同的坐标请求不同的地图的局部数据． 固定请求不同数据.对于这里的不同数据的特点在于时间上的不可知性.例如在聊天系统中我们等待别人发来的信息. 好了，我说说不合理的使用，我不建议把超链接和提交表单行为Ajax处理．因为他违反了我说的那两个问题的处理，第二这种体验逆反了我们的习惯．Web不是软件，我们都习惯了这种数据请求的刷新导致的展缓．举例就是我们对着相机摆POSE的时候都在等待快门咔的一声表示照片拍摄结束，后来出来了数码相机取消了机械相机里面反光板上抬曝光的组建使之静音，但是对于我们来说就很别扭了即使拍照者拍摄完成我们依然在那里摆着POSE等待结束时的咔的一声．后来数码相机又开始做了一个电子的声音咔，其目的是为了防止偷拍，但是也很好的让被拍摄者从新找回来那种咔的体验． 那么,如何解释tabs中的ajax应用呢?我对此也有一定的疑惑.【责编:snow】
如何在Java项目中使用Ajax?
如果要使用ajax，必须要导入相应的jquery.js等才可以用。具体用法如下：
$.ajax({
type: "GET",
url: "test.json",
data: {username:$("#username").val(), content:$("#content").val()},
dataType: "json",
success: function(data){
alert(data.status)
})
})
ajax技术适用于在页面不刷新的情况下前后台数据的动态数据交互。
如何在asp.net下利用AJAX技术实现树型目录结构
很简单.你后台先生成一级菜单的html比如
研发部
市场部
办公室
在addItem里调用ajax加载部门的子信息html,比如
研发一部
研发二部
研发三部
然后把html赋给传过来的ID,对象的 innerHTML即可.理论无限级.并且第一次只要加载根目录.速度比较快