浅谈Web数据交互(二)
3.XML方式
前面的两种方式都能传递数据,但是都有一个问题,就是提交数据后,页面会刷新,由于web是无状态的,所以我们必须通过代码来维持页面上的状态。(在asp.net里面微软通过ViewState来维护)所以我们要做到交互数据但是不刷新页面的话,就只有用xml了。
哇,不知道xml是什么冬冬啊?倒……
XML (eXtensible Markup Language)建议你看看两只老虎的《无废话XML》
GB版本:http://2tigers.net/xml_book/wfhxml_gb.zip
Big5版本:http://2tigers.net/xml_book/wfhxml_b5.zip
好下面我们来看看如何通过xml无刷新的交互数据:
来看一下数据流图
前台页面
xml.asp
<html>
<head>
<script language=”JavaScript”>
//hide for low version of ie
<!—
function EncodeForXML(string)
{
string=string.replace(/&/g,"&");
string=string.replace(/</g,"<");
string=string.replace(/>/g,">");
return string;
}
function CommunicateXMLData(sXML,ActionFileURL)
{
var xmlDoc = new ActiveXObject("MSXML.DOMDocument");
xmlDoc.async = false;
sXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><TEST>" + sXML + "</TEST>";
var httpObj = new ActiveXObject("Microsoft.XMLHTTP");
if(xmlDoc.loadXML(sXML))
{
httpObj.Open("POST",ActionFileURL,false);
httpObj.Send(xmlDoc);
return httpObj.responseXML.xml;
}
else
{
return "FALSE";
}
}
function SubmitInput()
{
var strXML;
strXML="<name>”+ EncodeForXML(iptname.value)+”</name>";
strXML = CommunicateXMLData (strXML," XMLX.asp");
var xmlDoc=new ActiveXObject("MSXML.DOMDocument")
xmlDoc.async=false;
if (xmlDoc.loadXML(strXML))
{
//xmlDoc为加载数据后的xml对象
txtname.value=xmlDoc.getElementsByTagName("Result")[0].text
}
}
//-->
</script>
</head>
<body>
Your name is:<input name=”txtname” type=”text” value=””><br>
<input type=”text” name=”iptname” id=”iptname” value=””>
<a href=”#” onclick=”JavaScript:SubmitInput();”>Go</a>
</body>
</html>
后台页面xmlx.asp
<%@ Language=VBScript codepage="65001"%>
<%
dim xmlDoc
dim strResult
set xmlDoc = server.CreateObject("MSXML.DOMDocument")
if xmlDoc.load(request)=true then
strResult=Trim(xmlDoc.selectSingleNode("//name ").text)
strReturn="<TEST><Result>Success” & strReturn & ”</Result></TEST>"
end if
Response.ContentType="text/xml"
Response.CharSet="UTF-8"
if xmlDoc.loadXML(strResult)=true then
xmlDoc.save Response
end if
Response.End
set xmlDoc=nothing
%>
下面解释一下程序的工作过程:
<a href=”#” onclick=”JavaScript:SubmitInput();”>Go</a>
当点击Go的时候触发JavaScript事件SubmitInput();
strXML="<name>”+ iptname.value+”</name>";
生成xml字符串
strXML =DataCommunicate(strXML," XMLX.asp");
调用函数DataCommunicate将生成的xml字符串发送到后台处理页面(XMLS.asp),
并接收后台页面处理之后返回的xml字符串
var xmlDoc=new ActiveXObject("MSXML.DOMDocument")
xmlDoc.async=false;
if (xmlDoc.loadXML(strXML))
{
//xmlDoc为加载数据后的xml对象
//处理返回的数据
txtname.value=xmlDoc.getElementsByTagName("Result")[0].text
}
通过xml交互数据,可以达到页面不刷新的结果,避免了交互一次数据就要维护一次页面控件的状态,同时也降低了网络的数据流量。
注意点:其中的EncodeForXML函数是将与xml有冲突的字符进行编码处理。
技巧:
当然我们可以将EncodeForXML函数与CommunicateXMLData函数写到一个js中,作为公用的函数,在需要进行xml交互数据的页面通过
<script LANGUAGE="javascript" Src="../Scripts/Communicate.js"></script>
包含进来。