太久沒(méi)有研究過(guò)新技術(shù)了.作為一個(gè)程序員,我覺(jué)得很慚愧.老早就想看看關(guān)于xmlhttp的技術(shù)了,今天總算有點(diǎn)時(shí)間,做個(gè)一個(gè)最初的體驗(yàn).馬上就愛(ài)上了它.
如果你想不刷新頁(yè)面就可以與后臺(tái)進(jìn)行數(shù)據(jù)交互,或者在異構(gòu)系統(tǒng)之間交換數(shù)據(jù),xmlhttp技術(shù)是個(gè)不錯(cuò)的選擇.
下面是我的一個(gè)很小的體驗(yàn)程序,參考了csdn網(wǎng)友s_phoenix()給人的回貼.
首先建一個(gè)tomcat的web項(xiàng)目.
1:-------index.htm文件內(nèi)容如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0Transitional//EN">
<HTML>
<HEAD>
<TITLE> NewDocument </TITLE>
<META NAME="Generator"CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<METANAME="Keywords" CONTENT="">
<META NAME="Description"CONTENT="">
</HEAD>
<BODY>
<script language="javascript">
varXML="<root><test>李春雷</test><test>毛澤東</test></root>"
varxmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
var xmlDoc=newActiveXObject("Msxml2.DOMDocument");
functiontest(){//客戶端xml的解析
xmlDoc.loadXML(XML);
if(xmlDoc.parseError.line>0){
throwxmlDoc.parseError.reason;
}
var nodes=xmlDoc.selectNodes("/root/test");
for(vari=0;i<nodes.length;i++){
alert(nodes.item(i).text);
}
}
functionaction(){//客戶端和服務(wù)端的通訊
xmlHttp.open("post","http://127.0.0.1:8888/xmlhttpTest/UrlTestServlet",false);
xmlHttp.setRequestHeader("context-type","text/xml;charset=utf-8");
xmlHttp.send(XML);
varshowstr=xmlHttp.responseText;
alert(showstr);
}
</script>
<buttononclick="test();">查看將要傳輸?shù)膞ml</button><br/>
<buttononclick="action();">朝服務(wù)器傳送xml,并接收服務(wù)器回應(yīng)</button>
</BODY>
</HTML>
2:------------寫(xiě)一個(gè)servlet: UrlTestServlet.java
/*
* 創(chuàng)建日期 2005-4-7
*
* TODO 要更改此生成的文件的模板,請(qǐng)轉(zhuǎn)至
* 窗口 - 首選項(xiàng) -Java - 代碼樣式 - 代碼模板
*/
package com.lcl;
import javax.servlet.*;
import javax.servlet.http.*;
importjava.io.*;
import java.util.*;
import org.dom4j.io.*;
importorg.dom4j.*;
/**
* @author lcl
*
* TODO 要更改此生成的類(lèi)型注釋的模板,請(qǐng)轉(zhuǎn)至
* 窗口 - 首選項(xiàng)- Java - 代碼樣式 - 代碼模板
*/
public -8";
//Initialize global variables
public void init() throwsServletException {
}
//Process the HTTP Get request
public void doGet(HttpServletRequest request, HttpServletResponseresponse)
throws ServletException, IOException{
response.setContentType(CONTENT_TYPE);
request.setCharacterEncoding("utf-8");
PrintWriterout = response.getWriter();
InputStream is=request.getInputStream();
SAXReader reader=new SAXReader();
Documentdoc=null;
try{
doc=reader.read(is);
} catch(Exceptionex){
System.out.println(ex);
}
String[] s=getElementTexts(doc,"test");
out.println("數(shù)據(jù)交換成功:返回" + s[0] + s[1]);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
doGet(request,response);
}
private String getElementText(Document doc,String name){
returndoc.getRootElement().element(name).getText();
}
private String[] getElementTexts(Document doc,String name){
Listl=doc.getRootElement().elements(name);
Iterator it=l.iterator();
Listl1=new LinkedList();
while(it.hasNext()){
Elemente=(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 WebApplication 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<display-name>Welcome toTomcat</display-name>
<description>
Welcome toTomcat
</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>
好了,啟動(dòng)tomcat,訪問(wèn):http://127.0.0.1:8888/xmlhttpTest/work/(如果你的tomcat端口是8080,就改一下)
看到結(jié)果了吧,真的很不錯(cuò).不用刷新頁(yè)面,就讓htm前臺(tái)頁(yè)面和后臺(tái)進(jìn)行了一次數(shù)據(jù)交換.
你甚至可以在不同的服務(wù)器之間進(jìn)行數(shù)據(jù)交換,比如一個(gè)mis系統(tǒng),和一個(gè)gis系統(tǒng),想整合成一個(gè)系統(tǒng),原先我們是用了一個(gè)frame,左邊的是mis,右邊的是gis,通過(guò)javascript在兩個(gè)系統(tǒng)間交換數(shù)據(jù).如果用xmlhttp技術(shù),完全沒(méi)必要這樣了.
聯(lián)系客服