太久没有研究过新技术了.作为一个程序员,我觉得很惭愧.老早就想看看关于xmlhttp的技术了,今天总算有点时间,做个一个最初的体验.马上就爱上了它.
如果你想不刷新页面就可以与后台进行数据交互,或者在异构系统之间交换数据,xmlhttp技术是个不错的选择.
下面是我的一个很小的体验程序,参考了csdn网友s_phoenix()给人的回贴.
首先建一个tomcat的web项目.
1:-------index.htm文件内容如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<script language="javascript">
var XML="<root><test>李春雷</test><test></test></root>"
var xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
var xmlDoc=new ActiveXObject("Msxml2.DOMDocument");
function test(){//客户端xml的解析
xmlDoc.loadXML(XML);
if(xmlDoc.parseError.line>0){
throw xmlDoc.parseError.reason;
}
var nodes= xmlDoc.selectNodes("/root/test");
for(var i=0;i<nodes.length;i++){
alert(nodes.item(i).text);
}
}
function action(){//客户端和服务端的通讯
xmlHttp.open("post","http://127.0.0.1:8888/xmlhttpTest/UrlTestServlet",false);
xmlHttp.setRequestHeader("context-type","text/xml;charset=utf-8");
xmlHttp.send(XML);
var showstr=xmlHttp.responseText;
alert(showstr);
}
</script>
<button onclick="test();">查看将要传输的xml</button><br/>
<button onclick="action();">朝服务器传送xml，并接收服务器回应</button>
</BODY>
</HTML>
2:------------写一个servlet: UrlTestServlet.java
/*
* 创建日期 2005-4-7
*
* TODO 要更改此生成的文件的模板，请转至
* 窗口 － 首选项 － Java － 代码样式 － 代码模板
*/
package com.lcl;
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
import java.util.*;
import org.dom4j.io.*;
import org.dom4j.*;
/**
* @author lcl
*
* TODO 要更改此生成的类型注释的模板，请转至
* 窗口 － 首选项 － Java － 代码样式 － 代码模板
*/
public class UrlTestServlet extends HttpServlet {
private static final String CONTENT_TYPE = "text/xml;charset=utf-8";
//Initialize global variables
public void init() throws ServletException {
}
//Process the HTTP Get request
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType(CONTENT_TYPE);
request.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
InputStream is=request.getInputStream();
SAXReader reader=new SAXReader();
Document doc=null;
try{
doc=reader.read(is);
} catch(Exception ex){
System.out.println(ex);
}
String[] s= getElementTexts(doc,"test");
out.println("数据交换成功:返回" + s[0] + s[1]);
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request,response);
}
private String getElementText(Document doc,String name){
return doc.getRootElement().element(name).getText();
}
private String[] getElementTexts(Document doc,String name){
List l=doc.getRootElement().elements(name);
Iterator it=l.iterator();
List l1=new LinkedList();
while(it.hasNext()){
Element e=(Element)it.next();
l1.add(e.getText());
}
return (String[])l1.toArray(new String[]{});
}
//Clean up resources
public void destroy() {
}
}
3:--------web.xml更改如下(加servlet映射):
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE web-app
PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<display-name>Welcome to Tomcat</display-name>
<description>
Welcome to Tomcat
</description>
<!-- JSPC servlet mappings start -->
<servlet>
<servlet-name>UrlTestServlet</servlet-name>
<servlet-class>com.lcl.UrlTestServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>UrlTestServlet</servlet-name>
<url-pattern>/UrlTestServlet</url-pattern>
</servlet-mapping>
<!-- JSPC servlet mappings end -->
<welcome-file-list>
<welcome-file>index.htm</welcome-file>
</welcome-file-list>
</web-app>
好了,启动tomcat,访问:http://127.0.0.1:8888/xmlhttpTest/work/(如果你的tomcat端口是8080,就改一下)
看到结果了吧,真的很不错.不用刷新页面,就让htm前台页面和后台进行了一次数据交换.
你甚至可以在不同的服务器之间进行数据交换,比如一个mis系统,和一个gis系统,想整合成一个系统,原先我们是用了一个frame,左边的是mis,右边的是gis,通过javascript在两个系统间交换数据.如果用xmlhttp技术,完全没必要这样了.
分享到：
相关推荐
**Ajax** 技术是21世纪初由Jesse James Garrett提出的一个概念，它结合了JavaScript、XML、HTML、CSS以及XMLHTTP等多种技术，实现了网页的局部更新。Ajax允许开发者在用户交互时动态更新内容，提高了Web应用的响应...
近年来，AJAX因其能够提升用户体验，使网页更加互动而备受关注。在本文中，我们将探讨如何开始使用AJAX，从创建XMLHttpRequest对象，到使用它获取XML文档，以及处理这些文档。 首先，创建XMLHttpRequest对象是AJAX...
7.6.3 XMLHTTP POST调用Web Service 293 7.6.4 SOAP调用Web Service 293 7.7 WinForm如何调用Web Service 295 7.7.1 .NET的WinForm调用Web Service 295 7.7.2 手动发送HTTP请求调用Web Service 295 7.8 实现异步调用...
7.6.3 XMLHTTP POST调用Web Service 293 7.6.4 SOAP调用Web Service 293 7.7 WinForm如何调用Web Service 295 7.7.1 .NET的WinForm调用Web Service 295 7.7.2 手动发送HTTP请求调用Web Service 295 7.8 实现异步调用...
本书主要介绍Ajax技术的组成元素，涉及JavaScript、CSS、DOM、XMLHTTP和XML等内容，其中详细介绍了JavaScript客户端语言，它是Ajax技术的核心组成，是提高客户端性能不可缺少的元素。 全书共分为4大部分，前3...
8. **XMLHttp中文参考手册.chm**：XMLHttpRequest（XHR）是实现异步数据交换的关键，这个手册解释了如何使用AJAX（异步JavaScript和XML）进行页面无刷新更新，提升用户体验。 通过这些资源，开发者不仅可以学习到...
这一技术在21世纪初因Gmail、Google Suggest和Google Maps等创新应用的出现而受到广泛关注。 ### 创建XMLHttpRequest对象 在JavaScript中，创建一个XMLHttpRequest对象是实现AJAX的核心步骤。对于不同浏览器，创建...
这个技术在2000年代初由Google的Gmail、Google Suggest和Google Maps等应用推动，极大地提升了用户体验。 ### **一、创建XMLHttpRequest对象** 创建一个用于发送HTTP请求的XMLHttpRequest对象是Ajax的核心步骤。在...
最新发布酷站分类目录管理系统CATCHWEB v2.02（修改版） 程序名称：酷站分类目录管理系统CATCHWEB v2.02（修改版） <br>程序类别：ASP源码 <br>支持环境：ASP+ACCESS+XMLHTTP <br>官方主页：...