使用AJAX开发简单在线小词典

开发环境以及资源:eclipse+tomcat6.0+JDK5+dom4j+xml

首先将写好的简单词典文件words-xml,放入已经建好工程的web-inf目录下

words.xml内容为:

<?xml version="1.0" encoding="GBK"?>
<words>
<word>
<en>hello</en>
<cn>你好</cn>
</word>
<word>
<en>test</en>
<cn>n. 测试,试验</cn>
<cn>v. 测试,试验,接受测验</cn>
</word>
</words>

在webroot目录下新建一个查询词典的html页面:searchwords.html

<script type="text/javascript">
var xmlHttp;
var searchWord="";
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function doSearch(){
createXMLHttpRequest();
searchWord = document.getElementById("userword").value;

xmlHttp.open("GET","/WordsXML/parsewords?word="+searchWord,true);
xmlHttp.onreadystatechange = ResultCheck;
xmlHttp.send(null);
}
function ResultCheck(){
// alert(xmlHttp.status);
if(xmlHttp.readyState ==4){
if(xmlHttp.status ==200){

document.getElementById("searchResult").innerHTML= xmlHttp.responseText;
}
}
}
</script>
Input Word:
<input type="text" id="userword" size=30>
<input type="button" value="Search" onclick="doSearch()">
<hr>
<div id="searchResult">
</div>

然后在src目录下写一个servlet:名称为ParseWordsServlet.java

(省略导入的包.)

public class ParseWordsServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
String word = request.getParameter("word");
Document doc = null;
SAXReader read = new SAXReader();
try {
String url = getServletContext().getRealPath("/")+"WEB-INF//words.xml";
System.out.print(url);
doc = read.read(url);
} catch (DocumentException e) {
e.printStackTrace();
}
String output = "";
Element root = doc.getRootElement();
for (Iterator iter = root.elementIterator("word"); iter.hasNext();) {
Element e = (Element) iter.next();
String eValue = e.element("en").getText();
if (eValue.equals(word)) {
for (Iterator iter2 = e.elementIterator("cn"); iter2.hasNext();) {
Element cnE = (Element) iter2.next();
output += cnE.getText() + "<br>";

}

}

}
if(output.equals("")){
output="not find it!!";
}
response.setContentType("text/xml");
response.setCharacterEncoding("UTF-8");
PrintWriter out = response.getWriter();
out.print(output);
out.close();
}
}

配置web-inf目录下的web.xml文件:

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<servlet>
<servlet-name>ParseWords</servlet-name>
<servlet-class>
com.runwit.words.ParseWordsServlet
</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ParseWords</servlet-name>
<url-pattern>/parsewords</url-pattern>
</servlet-mapping>
</web-app>

启动tomcat6.0,打开目标网页,测试.