使用XMLHTTP可以在页面中实现无涮新自动获取服务器的新数据,
在一些聊天室中可以非常方便实现涮新新数据,同样,也可以在其它
BS应用中实现定时涮新页面数据。但在使用XMLHTTP和DOMDocument时
会碰到一些问题.一个是如何传送参数,二是中文乱码问题,还有就是如何解析XML代码。
1、参数传送和获得参数值
XMLHTTP的send方法
Send(varBody)
varBody:指令集。可以是XML格式数据,也可以是字符串,流,或者一个无符号整数数组。
也可以省略,让指令通过Open方法的URL参数代入。
send方法也可以传送参数对,各参数之间可以用&隔开,比如
var post = "id=1000&page=3";
xmlhttp.send(post);
或是在OPen方法的URL参数上加入,如
xmlhttp.open("POST", "http://localhost:8088/getData?id=1000&page=3", false);
在JSP或是Servlet中,可以和平常一样从request中得到参数
String id = (String)req.getParameter("id");
String page = (String)req.getParameter("page");
因为XMLHTTP发送的请求不是multipart/form-data格式的
因而注意在Servlet不能用multipart/form-data格式的一些方法。
2、中文乱码问题
XMLHTTP是以UTF-8编码格式发送请求和接收返回值的,因而如果不有进行编码处理,
而在发送的参数中或是接收的返回值中有中文,那么我们看到的是乱码
首先对发送的参数进行处理
var post="Years=2004-2005&TermID=秋冬"; //含有中文
xmlhttp.open("POST", "http://localhost:8088/getData", false);
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //要有此句
xmlhttp.setRequestHeader("Content-Length",post.length);
xmlhttp.send(post);
在servlet里取参数时,对request进行编码处理
req.setCharacterEncoding("UTF-8");
然后取参数
String years = (String)req.getParameter("Years");
String termID = (String)req.getParameter("TermID");
如果在Servlet里有输出数据到请求的页面时,如果包含有中文,
也要进行编码处理
首先对response进行编码处理
private static final String CONTENT_TYPE = "text/html; charset=UTF-8";
res.setContentType(CONTENT_TYPE);
在输出的XML代码中用UTF-8进行编码
out.println("<?xml version=/"1.0/" encoding=/"UTF-8/" standalone=/"yes/" ?>");
out.println("<root>");
out.println("<person id=1>");
out.println("<name>张三</name>");
out.println("<gender>男</gender>");
out.println("</person>");
out.println("<book id=1>");
out.println("<bookid>11</bookid>");
out.println("<title>设计模式</title>");
out.println("</book>");
...
out.println("</root>");
3、在页面中对XML代码进行解析
全部代码如下
<script language="JavaScript">
function getNodeValue(root,NodeName)
{
try{
var node = root.selectSingleNode(NodeName);
return node.text;
}catch(e){
return "";
}
}
function getPersonNodeAttributes(XmlDoc)
{
var text = "";
var obj = XmlDoc.getElementsByTagName("person");
for (var i=0;i<obj.length;i++)
{
var node = obj.item(i);
var id=node.getAttribute("id");
var name=getNodeValue(node,"name");
var gender=getNodeValue(node,"gender");
text = "id = " + id + ",name = " + name + ",gender = " + gender;
alert(text);
}
return text;
}
function getBookNodeAttributes(XmlDoc)
{
var text = "";
var obj = XmlDoc.getElementsByTagName("book");
for (var i=0;i<obj.length;i++)
{
var node = obj.item(i);
var id=node.getAttribute("id");
var bookid=getNodeValue(node,"bookid");
var title=getNodeValue(node,"title");
text = "id = " + id + ",bookid = " + bookid + ",title = " + title;
alert(text);
}
return text;
}
//setInterval("checkResult()", 1000);//定时调用checkResult方法取新数据
function checkResult()
{
var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.4.0");
xmlDoc.async = false;
var post="Years=2004-2005&TermID=秋冬";
var xmlhttp = new ActiveXObject("Msxml2.XMLHTTP.4.0");
xmlhttp.open("POST", "http://localhost:8088/getData", false);
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-Length",post.length);
xmlhttp.send(post);
xmlDoc.loadXML(xmlhttp.responseText);
var person = getBookNodeAttributes(xmlDoc);
var book = getPersonNodeAttributes(xmlDoc);
}
</SCRIPT>