溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

如何通過XML數(shù)據(jù)島和Dom制作通訊錄

發(fā)布時間：2021-06-24 10:07:58 來源：億速云 閱讀：164 作者：小新 欄目：編程語言

這篇文章主要為大家展示了“如何通過XML數(shù)據(jù)島和Dom制作通訊錄”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“如何通過XML數(shù)據(jù)島和Dom制作通訊錄”這篇文章吧。

一般情況下，如果要為網(wǎng)站提供一個通訊錄程序，需要使用CGI結(jié)合后臺數(shù)據(jù)庫技術(shù)，這對WEB服務(wù)器的要求比較高，在很多不提供數(shù)據(jù)庫功能的虛擬主機上甚至無法實現(xiàn)。當(dāng)然，我們還可以采用TXT文本替代數(shù)據(jù)庫，但TXT文本是比較難操作的，我們必須一行一行的讀取判斷，還要用分隔字符串實現(xiàn)字段分離，無法進行復(fù)雜運算。
現(xiàn)在，我們可以使用“可擴展的標(biāo)記語言 (xml)” 來保存通訊錄的數(shù)據(jù)，從而體現(xiàn)出XML的優(yōu)點：表現(xiàn)數(shù)據(jù)的結(jié)構(gòu)化方法，對于保存許多關(guān)系型數(shù)據(jù)結(jié)構(gòu)的文件很有幫助。

一、基本原理：
在Microsoft Internet Explorer 5.0及以后的版本里，我們可以利用XML元素來創(chuàng)建數(shù)據(jù)島，數(shù)據(jù)島就是被HTML頁面引用或包含的XML數(shù)據(jù)，XML數(shù)據(jù)可以包含在HTML文件內(nèi)，也可以包含在某外部文件內(nèi)，利用XML數(shù)據(jù)島可以讓我們免除編寫復(fù)雜腳本的麻煩。DOM可對XML文檔進行解析，文檔中的元素、實體、屬性等所有個體都可以用對象模型表示，整個文檔的邏輯結(jié)構(gòu)類似一棵樹，生成的對象模型就是樹的節(jié)點，每個對象同時包含了方法和屬性，DOM提供了許多查找節(jié)點的方法。利用DOM，開發(fā)人員可以動態(tài)地創(chuàng)建XML、遍歷文檔、增加（刪除/修改）文檔內(nèi)容，DOM提供的API與編程語言無關(guān)，所以對一些DOM標(biāo)準(zhǔn)中沒有明確定義的接口，不同解析器的實現(xiàn)方法可能會有所差別。

二、具體流程為：
１、定義XML文件如下所示：

<?xml version="1.0" encoding="gb2312"?> 
　　　　<中國計算機世界出版服務(wù)公司通信錄> 
　　　　　　<計算機世界 contactID="2"> 
　　　　　　　　<部門名稱>計算機室</部門名稱> 
　　　　　　　　<電話號碼>139</電話號碼> 
　　　　　　　　<電子郵件>fsdos@163.net</電子郵件> 
　　　　　　</計算機世界> 
　　　　</中國計算機世界出版服務(wù)公司通信錄>

將上述XML文檔保存為tele.xml文件，同時，將上述XML文檔中的字段內(nèi)容置空，做為初始化框架數(shù)據(jù)，另存為newid.xml文件。
２、客戶端加載 XML 文檔，在放置通訊錄的表格中通過DATASRC='#xmldso'將XML文件綁定在表格中，DATASRC屬性實際上是通過在要處理的XML元素的ID屬性的前面加上#來實現(xiàn)的，所以我們可以在TD元素中間指定具體需要顯示的字段；
３、使用DOM技術(shù)對通訊錄進行增加、刪除記錄操作；
４、通過xmlhttp協(xié)議連接到服務(wù)器，保存XML文檔。

三、XML DOM編程簡述：
１、客戶端dom.htm頁面：

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<XML id=newid></XML> <!--加載xml數(shù)據(jù)--> 
<SCRipT Language=javaScript> 
newid.async = false; 
newid.load("newid.xml"); 
//增加記錄； 
function addID(){ 
var doc=xmldso.XMLDocument 
var rootnode=doc.documentElement 
var sortNode = rootnode.selectNodes("//部門名稱") 
var currentid = sortNode.length-1 
var cc=sortNode.item(currentid).text; 
if ((cc=="尚未輸入")||(cc=="")) 
{ 
alert("請將最后一行數(shù)據(jù)填寫完畢后再增加新的記錄！"); 
} 
else 
{  
var node= newid.documentElement.childNodes(0).cloneNode(true); 
var contactID=parseInt(sortNode.item(currentid).parentNode.getAttribute("contactID"))+1;  
node.setAttribute("contactID",contactID);  
xmldso.documentElement.appendChild(node); 
} 
} 
//刪除記錄 
function delID(whichFld){ 
var sortNode = xmldso.selectSingleNode("//計算機世界[@contactID='"+whichFld+"']"); 
if (sortNode.parentNode.childNodes.length>1) sortNode.parentNode.removeChild(sortNode);  
} 
</SCRIPT> 
<script language="vbscript"> 
Sub cc_onmouseup '保存記錄； 
Dim objXML, objXSL, objfso,strFile, strFileName, strXSL,strURL,TheForm 
set SaveXMLDoc=xmldso.XMLDocument 
strURL="dns2.asp" 
Set objXML = CreateObject("Microsoft.XMLHTTP") '創(chuàng)建MS的XMLHTTP組件； 
objXML.Open "post",strURL,false '采用Post提交方式； 
objXML.setrequestheader "content-type","application/x-www-form-urlencoded" 
objXML.send SaveXMLDoc ' 發(fā)送信息，保存XML數(shù)據(jù)； 
'xmlGet = objXML.responsebody '稍等片刻后，得到服務(wù)器端傳回來的結(jié)果； 
msgbox "保存成功！"  
Set objXML = Nothing 
end sub  
</SCRIPT> 
<center><b>計算機世界----通信錄</b><br><br> 
<TABLE id="table" DATASRC='#xmldso' BORDER CELLPADDING=3> 
<!--進行數(shù)據(jù)綁定--> 
<THEAD><TH>編號</TH><TH>部門名稱</TH><TH>電話號碼</TH><TH>電子郵件</TH></THEAD> 
<TR> 
<TD><acronym title='點擊即可刪除該記錄'><INPUT TYPE=button size=4 DATAFLD="contactID" onclick="delID(this.value)"></acronym></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="部門名稱"></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="電話號碼"></TD>  
<TD><INPUT TYPE=TEXT DATAFLD="電子郵件"></TD> 
</TR> 
</TABLE> 
<INPUT TYPE=BUTTON name=dd id=dd VALUE="增加記錄" onmouSEOver="this.focus()" onmousedown="addID();"> 
<INPUT TYPE=BUTTON name=cc id=cc VALUE="保存"></center></BODY></HTML>

２、服務(wù)器端dns2.asp程序比較簡單，在接收到XML數(shù)據(jù)后，創(chuàng)建文件對象，保存到tele.xml即可：

< 
Set ReceivedDoc = CreateObject("Microsoft.XMLDOM") '創(chuàng)建 XML DOM實例； 
ReceivedDoc.async=False 
ReceivedDoc.load Request '接收XML數(shù)據(jù)； 
Set files=Server.CreateObject("Scripting.FileSystemObject") 
Set numtxt=files.CreateTextFile(Server.MapPath("tele.xml"),True) 
numtxt.WriteLine(replace(ReceivedDoc.xml,"?>"," encoding=""gb2312""?>")) '將XML數(shù)據(jù)寫入文件 
numtxt.Close 
response.write ReceivedDoc.xml 
>

３、實際使用過程中，還需要增加一個顯示通訊錄的網(wǎng)頁index.htm，其實就是上面dom.htm的簡化版，去除所有增加、刪除、修改和保存功能，只在表格單元格中用ＬＡＢＥＬ顯示數(shù)據(jù)：

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<center><b>計算機世界----通信錄</b><br><br> 
<TABLE id="table" DATASRC='#xmldso' BORDER CELLPADDING=3> 
<THEAD><TH>編號</TH><TH>部門名稱</TH><TH>電話號碼</TH><TH>電子郵件</TH> 
</THEAD> 
<TR> 
<TD><label DATAFLD="contactID"></label></TD> 
<TD><label DATAFLD="部門名稱"></label></TD> 
<TD><label DATAFLD="電話號碼"></label></TD>  
<TD><label DATAFLD="電子郵件"></label></TD> 
</TR> 
</TABLE> 
</center></BODY></HTML>

四、使用XML數(shù)據(jù)島結(jié)合Dom技術(shù)的優(yōu)點：
１、首先，當(dāng)然是XML本身帶來的好處。XML打破了標(biāo)記定義的壟斷，你可以自定義字段名稱，在本文所用的XML文件中，連字段名都可以為中文，數(shù)據(jù)非常地簡單明晰，因為它所攜帶的信息不是顯示上的描述，而是信息的語意，極大的加強了文檔的可讀性。使用XML也便于不同系統(tǒng)之間信息的傳輸。
２、XML數(shù)據(jù)島允許用戶在客戶端訪問與操控數(shù)據(jù)集，不必頻繁的與服務(wù)器交互，這對于減輕服務(wù)器的負荷很有幫助。同時，由于XML數(shù)據(jù)島本身的特點，使得在客戶端的數(shù)據(jù)操作十分簡便，減少了編程量。
３、DOM強制使用樹模型來訪問XML文檔中的信息，由于XML本質(zhì)上就是一種分層結(jié)構(gòu)，所以這種描述方法是相當(dāng)有效的。通過DOM接口，應(yīng)用程序可以在任何時候訪問XML文檔中的任何一部分數(shù)據(jù)，控制起來相當(dāng)靈活。
４、采用xmlhttp對象傳送XML數(shù)據(jù)到服務(wù)器，客戶端頁面無閃爍刷新現(xiàn)象。

本程序在基于Windows2000平臺的IIS5.0和IE5.0上運行通過。在實際運用過程中，還可使用DOM結(jié)合XSL技術(shù)為通訊錄增加排序、格式轉(zhuǎn)換和數(shù)據(jù)查找等功能，使用XML數(shù)據(jù)島的datapagesize屬性以及PReviousPage、nextPage函數(shù)為通訊錄增加分頁功能，使用DTD與XML Schema動態(tài)驗證通訊錄數(shù)據(jù)。

------------------------THE END----------------------

附：(全部源程序)
****************************************************************************
一、index.htm（顯示通訊錄）:

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<center><b>計算機世界----通迅錄</b><br><br> 
<TABLE id="table" DATASRC='#xmldso' BORDER CELLPADDING=3> 
<THEAD><TH>編號</TH><TH>部門名稱</TH><TH>電話號碼</TH><TH>電子郵件</TH> 
</THEAD> 
<TR> 
<TD><label DATAFLD="contactID"></label></TD> 
<TD><label DATAFLD="部門名稱"></label></TD> 
<TD><label DATAFLD="電話號碼"></label></TD>  
<TD><label DATAFLD="電子郵件"></label></TD> 
</TR> 
</TABLE> 
</center></BODY></HTML>

****************************************************************************

二、dom.htm（在線編輯通訊錄）：

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<XML id=newid></XML> 
<SCRIPT Language=Javascript> 
newid.async = false; 
newid.load("newid.xml"); 
function addID(){ 
var doc=xmldso.XMLDocument 
var rootnode=doc.documentElement 
var sortNode = rootnode.selectNodes("//部門名稱") 
var currentid = sortNode.length-1 
var cc=sortNode.item(currentid).text; 
if ((cc=="尚未輸入")||(cc=="")) 
{ 
alert("請將最后一行數(shù)據(jù)填寫完畢后再增加新的記錄！"); 
} 
else 
{  
var node= newid.documentElement.childNodes(0).cloneNode(true); 
var contactID=parseInt(sortNode.item(currentid).parentNode.getAttribute("contactID"))+1;  
node.setAttribute("contactID",contactID);  
xmldso.documentElement.appendChild(node); 
} 
} 
function delID(whichFld){ 
var sortNode = xmldso.selectSingleNode("//計算機世界[@contactID='"+whichFld+"']"); 
if (sortNode.parentNode.childNodes.length>1) sortNode.parentNode.removeChild(sortNode);  
} 
</SCRIPT> 
<script language="vbscript"> 
Sub cc_onmouseup '當(dāng)點擊“保存”按鈕時觸發(fā)； 
Dim objXML, objXSL, objFSO,strFile, strFileName, strXSL,strURL,TheForm 
set SaveXMLDoc=xmldso.XMLDocument 
strURL="dns2.asp" 
Set objXML = CreateObject("Microsoft.XMLHTTP") '創(chuàng)建MS的XMLHTTP組件； 
objXML.Open "post",strURL,false '采用Post提交方式； 
objXML.setrequestheader "content-type","application/x-www-form-urlencoded" 
objXML.send SaveXMLDoc ' 發(fā)送信息 
'xmlGet = objXML.responsebody '稍等片刻后，得到服務(wù)器端傳回來的結(jié)果； 
msgbox "保存成功！"  
Set objXML = Nothing 
end sub  
</SCRIPT> 
<center><b>計算機世界----通信錄</b><br><br> 
<TABLE id="table" DATASRC='#xmldso' BORDER CELLPADDING=3> 
<THEAD> 
<TH>編號</TH> 
<TH>部門名稱</TH> 
<TH>電話號碼</TH> 
<TH>電子郵件</TH> 
</THEAD> 
<TR> 
<TD><acronym title='點擊即可刪除該記錄'><INPUT TYPE=button size=4 DATAFLD="contactID" onclick="delID(this.value)"></acronym></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="部門名稱"></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="電話號碼"></TD>  
<TD><INPUT TYPE=TEXT DATAFLD="電子郵件"></TD> 
</TR> 
</TABLE> 
<INPUT TYPE=BUTTON name=dd id=dd VALUE="增加記錄" onmouseover="this.focus()" onmousedown="addID();"> 
<INPUT TYPE=BUTTON name=cc id=cc VALUE="保存"></center></BODY></HTML>

****************************************************************************

三、dns2.asp（后臺保存通訊錄）：

<% 
Set ReceivedDoc = CreateObject("Microsoft.XMLDOM") 
ReceivedDoc.async=False 
ReceivedDoc.load Request 
Set files=Server.CreateObject("Scripting.FileSystemObject") 
Set numtxt=files.CreateTextFile(Server.MapPath("tele.xml"),True) 
numtxt.WriteLine(replace(ReceivedDoc.xml,"?>"," encoding=""gb2312""?>")) 
numtxt.Close 
response.write ReceivedDoc.xml 
%>

****************************************************************************

四、tele.xml（通訊錄XML文檔）：

<?xml version="1.0" encoding="gb2312"?> 
<中國計算機世界出版服務(wù)公司通信錄> 
<計算機世界 contactID="1"> 
<部門名稱>電話總機</部門名稱> 
<電話號碼>010-68130909</電話號碼> 
<電子郵件>webmaster@ccw.com.cn</電子郵件> 
</計算機世界> 
</中國計算機世界出版服務(wù)公司通信錄>

****************************************************************************

五、newid.xml（通訊錄XML初始化文檔）： 

<?xml version="1.0" encoding="gb2312"?> 
<中國計算機世界出版服務(wù)公司通信錄> 
<計算機世界 contactID="1"> 
<部門名稱>尚未輸入</部門名稱> 
<電話號碼>保密</電話號碼> 
<電子郵件>保密</電子郵件> 
</計算機世界> 
</中國計算機世界出版服務(wù)公司通信錄>

以上是“如何通過XML數(shù)據(jù)島和Dom制作通訊錄”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！

向AI問一下細節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手