使用AJAX异步获取数据［转］(页 1) - Ajax论坛

梦幻情缘 发表于 2006-4-27 14:30

使用AJAX异步获取数据［转］

AJAX这个名字看起来很神奇，我第一次见到它也被它吸引了，它是Asynchronous JavaScript and XML的简写，异步的JAVASCRIPT和XML，关于AJAX的介绍在网上的介绍太多了，我就不多那么多了，我的口才不好，没他们说的那么精彩，可以去<a href="http://zh.wikipedia.org/wiki/AJAX" target="_blank" >http://zh.wikipedia.org/wiki/AJAX</A> 看看，在这里我只是给大家一个例子，了解如何去使用AJAX。
AJAX最有意思的地方就是可以不用刷新网页而可以和后台进行交互，不需要对页面进行刷新，实现网页与网页间的平滑过渡。使用AJAX不需要安装新的插件，只要求你的浏览器支持JAVASCRIPT。
首先你需要你个JAVASCRIPT中的对象XMLHttpRequest，它是AJAX的核心，我们都围绕着它做事，通过下面的代码可以获取一个：
<TABLE cellSpacing=0 borderColorDark=#ffffff cellPadding=2 width=400 align=center borderColorLight=black border=1>

<TR>
<TD class=code bgColor=#e6e6e6><PRE>if (window.XMLHttpRequest){ xmlObj = new XMLHttpRequest(); }else if (window.ActiveXObject){ xmlObj = new ActiveXObject("Microsoft.XMLHTTP"); }
我们通过这个对象的OPEN方法向服务发送请求，该函数声明为XMLHttpRequest.open(String method, String URL, boolean asynchronous);
method是请求的方式，可以为GET和POST URL是你要请求的资源 asynchronous是布尔类型，为true表示交互设置为异步
xmlObj.open("GET",URL,true); xmlObj.send("");
调用send()（参数是空或是null）将会发起一次请求，对于GET方式的请求，两次同样的请求将会得到相同的结果，由于为将交互设置为异步方式，因此要为指定一个回调函数：
xmlObj.onreadystatechange = callBackFunction; 剩下的事就交给回调函数处理了。有一点要注意了，用Servlet或JSP来响应异步请求时，要设置reponse的contentType属性指明是XML格式：
response.setContentType("text/xml"); 一切都准备好了，那我们现在来做一个简单的异步请求，并将请求返回的结果显示出来：
客户端：
<html> <script language="javascript"> function load(resource) { if (window.XMLHttpRequest){ xmlObj = new XMLHttpRequest(); }else if (window.ActiveXObject){ xmlObj = new ActiveXObject("Microsoft.XMLHTTP"); }else { return; } xmlObj.onreadystatechange = handleResponse; xmlObj.open("GET",resource,true); xmlObj.send(""); } function handleResponse() { if (xmlObj.readyState == 4){//xmlObj loaded if (xmlObj.status == 200){ var datas = xmlObj.responseXML.getElementsByTagName("data"); var obj = document.getElementById("data"); obj.innerText = datas[0]; } } } </script> <body> <a href="#" onclick="load('data.jsp')">发送请求</a> 看这里! </body> </html> 以下是data.jsp
<%response.setContentType("text/xml");%> <?xml version='1.0' encoding='gb2312' ?> <home> <data>Zjcfan</data> </home></PRE></TD></TR></TABLE>

sexy22 发表于 2008-10-2 15:56

很经典。。。。。。[em02]

页: [1]